{"id":1000267,"date":"2026-06-23T10:19:29","date_gmt":"2026-06-23T09:19:29","guid":{"rendered":"https:\/\/panindiatrips.com\/shaideeamore\/?page_id=1000267"},"modified":"2026-07-14T20:19:42","modified_gmt":"2026-07-14T19:19:42","slug":"custom-jewellery","status":"publish","type":"page","link":"https:\/\/shaideeamore.com\/hi\/custom-jewellery\/","title":{"rendered":"Custom Jewellery"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1000267\" class=\"elementor elementor-1000267\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ef45519 e-flex e-con-boxed glozin-responsive-column glozin-tablet-column--default glozin-responsive-column glozin-mobile-column--default glozin-responsive-column glozin-motion--var(--position) e-con e-parent\" data-id=\"ef45519\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-97ae5e0 elementor-widget elementor-widget-html\" data-id=\"97ae5e0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>Jewellery \u2014 Custom Order Enquiry<\/title>\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:ital,wght@0,300;0,400;0,500;1,300;1,400&family=Roboto+Slab:wght@300;400;500;600&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\r\n\r\n  :root {\r\n    --gold: #B8923A;\r\n    --gold-light: #D4AF6A;\r\n    --gold-pale: #F5EDD8;\r\n    --gold-deep: #8B6A22;\r\n    --ink: #1A1410;\r\n    --smoke: #F8F5F0;\r\n    --stone: #7A6E62;\r\n    --border: rgba(184,146,58,0.25);\r\n    --border-soft: rgba(122,110,98,0.2);\r\n  }\r\n\r\n  html { scroll-behavior: smooth; }\r\n\r\n  body {\r\n    font-family: 'Roboto', sans-serif;\r\n    background: #F2EDE4;\r\n    color: var(--ink);\r\n    min-height: 100vh;\r\n    background-image:\r\n      radial-gradient(ellipse at 20% 20%, rgba(184,146,58,0.06) 0%, transparent 60%),\r\n      radial-gradient(ellipse at 80% 80%, rgba(184,146,58,0.04) 0%, transparent 60%);\r\n  }\r\n\r\n\r\n\r\n  .container {\r\n    max-width: 720px;\r\n    margin: 0 auto;\r\n    padding: 40px 24px 60px;\r\n  }\r\n\r\n  \/* Hero *\/\r\n  .hero {\r\n    text-align: center;\r\n    padding: 3rem 0 2.5rem;\r\n    border-bottom: 0.5px solid var(--border);\r\n    margin-bottom: 2.5rem;\r\n  }\r\n  .hero-tag {\r\n    font-size: 10px;\r\n    letter-spacing: 0.3em;\r\n    text-transform: uppercase;\r\n    color: var(--gold);\r\n    font-weight: 400;\r\n    margin-bottom: 1rem;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 10px;\r\n  }\r\n  .hero-tag::before, .hero-tag::after {\r\n    content: '';\r\n    display: inline-block;\r\n    width: 24px;\r\n    height: 0.5px;\r\n    background: var(--gold);\r\n    opacity: 0.5;\r\n  }\r\n  .hero-title {\r\n    font-family: 'Roboto Slab', serif;\r\n    font-size: 48px;\r\n    font-weight: 300;\r\n    line-height: 1.1;\r\n    color: var(--ink);\r\n    letter-spacing: -0.01em;\r\n    margin-bottom: 0.75rem;\r\n  }\r\n  .hero-title em { font-style: italic; color: var(--gold); }\r\n  .hero-sub {\r\n    font-size: 14px;\r\n    color: var(--stone);\r\n    font-weight: 300;\r\n    line-height: 1.7;\r\n    max-width: 400px;\r\n    margin: 0 auto;\r\n  }\r\n\r\n  \/* Ornament *\/\r\n  .ornament {\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 16px;\r\n    margin: 2rem 0;\r\n  }\r\n  .ornament-line {\r\n    flex: 1;\r\n    height: 0.5px;\r\n    background: linear-gradient(to right, transparent, var(--border));\r\n  }\r\n  .ornament-line.r { background: linear-gradient(to left, transparent, var(--border)); }\r\n  .ornament-gem {\r\n    width: 8px; height: 8px;\r\n    background: var(--gold);\r\n    transform: rotate(45deg);\r\n  }\r\n  .ornament-gem-sm {\r\n    width: 5px; height: 5px;\r\n    background: var(--gold-light);\r\n    transform: rotate(45deg);\r\n  }\r\n\r\n  \/* Step bar *\/\r\n  .steps {\r\n    display: flex;\r\n    gap: 0;\r\n    margin-bottom: 2.5rem;\r\n    border: 0.5px solid var(--border);\r\n    border-radius: 4px;\r\n    overflow: hidden;\r\n    background: #fff;\r\n    box-shadow: 0 2px 20px rgba(184,146,58,0.06);\r\n  }\r\n  .step {\r\n    flex: 1;\r\n    text-align: center;\r\n    padding: 14px 8px;\r\n    font-size: 10px;\r\n    font-weight: 400;\r\n    letter-spacing: 0.1em;\r\n    text-transform: uppercase;\r\n    color: var(--stone);\r\n    cursor: pointer;\r\n    border-right: 0.5px solid var(--border);\r\n    background: var(--smoke);\r\n    transition: all 0.25s;\r\n    position: relative;\r\n  }\r\n  .step:last-child { border-right: none; }\r\n  .step.active { background: var(--gold); color: #fff; }\r\n  .step.done { background: var(--gold-pale); color: var(--gold-deep); }\r\n  .step-num {\r\n    display: block;\r\n    font-family: 'Roboto Slab', serif;\r\n    font-size: 22px;\r\n    font-weight: 300;\r\n    line-height: 1;\r\n    margin-bottom: 4px;\r\n  }\r\n\r\n  \/* Card wrapper *\/\r\n  .form-card {\r\n    background: #fff;\r\n    border: 0.5px solid var(--border);\r\n    border-radius: 6px;\r\n    padding: 2rem 2.5rem;\r\n    box-shadow: 0 4px 40px rgba(184,146,58,0.07);\r\n  }\r\n\r\n  .section { display: none; }\r\n  .section.visible { display: block; }\r\n\r\n  \/* Fields *\/\r\n  .field-group { margin-bottom: 1.75rem; }\r\n  .field-label {\r\n    font-size: 10px;\r\n    letter-spacing: 0.2em;\r\n    text-transform: uppercase;\r\n    font-weight: 500;\r\n    color: var(--stone);\r\n    margin-bottom: 10px;\r\n    display: block;\r\n  }\r\n  .req { color: var(--gold); margin-left: 3px; }\r\n\r\ninput[type=text],\r\ninput[type=email],\r\ninput[type=tel],\r\ninput[type=date],\r\ntextarea,\r\nselect {\r\n  width: 100%;\r\n  padding: 11px 16px;\r\n  border: 0.5px solid rgba(122,110,98,0.35);\r\n  border-radius: 3px;\r\n  font-family: 'Roboto', sans-serif;\r\n  font-size: 14px;\r\n  font-weight: 300;\r\n  color: var(--ink);\r\n  background: #fdfcfa;\r\n  outline: none;\r\n  transition: border 0.2s, box-shadow 0.2s;\r\n}\r\n  input:focus, textarea:focus, select:focus {\r\n    border-color: var(--gold);\r\n    box-shadow: 0 0 0 3px rgba(184,146,58,0.08);\r\n  }\r\n  textarea {\r\n    resize: vertical;\r\n    min-height: 100px;\r\n    line-height: 1.7;\r\n  }\r\n  select {\r\n    appearance: none;\r\n    background-image: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23B8923A' stroke-width='1.5' fill='none'\/%3E%3C\/svg%3E\");\r\n    background-repeat: no-repeat;\r\n    background-position: right 16px center;\r\n    cursor: pointer;\r\n  }\r\n\r\n  .row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }\r\n\r\n  \/* Tiles *\/\r\n  .tile-group {\r\n    display: grid;\r\n    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));\r\n    gap: 10px;\r\n    margin-top: 10px;\r\n  }\r\n  .tile {\r\n    border: 0.5px solid rgba(122,110,98,0.3);\r\n    border-radius: 4px;\r\n    padding: 14px 10px;\r\n    text-align: center;\r\n    cursor: pointer;\r\n    transition: all 0.2s;\r\n    background: #fdfcfa;\r\n    user-select: none;\r\n  }\r\n  .tile:hover { border-color: var(--gold-light); background: rgba(245,237,216,0.4); }\r\n  .tile.selected { border-color: var(--gold); background: var(--gold-pale); }\r\n  .tile-icon { font-size: 22px; margin-bottom: 7px; display: block; }\r\n  .tile-name { font-size: 12px; font-weight: 500; letter-spacing: 0.04em; color: var(--ink); }\r\n  .tile-sub { font-size: 11px; color: var(--stone); margin-top: 3px; font-weight: 300; }\r\n\r\n  \/* Budget tiles *\/\r\n  .budget-group {\r\n    display: grid;\r\n    grid-template-columns: 1fr 1fr;\r\n    gap: 10px;\r\n    margin-top: 10px;\r\n  }\r\n  .budget-tile {\r\n    border: 0.5px solid rgba(122,110,98,0.3);\r\n    border-radius: 4px;\r\n    padding: 14px 16px;\r\n    cursor: pointer;\r\n    transition: all 0.2s;\r\n    background: #fdfcfa;\r\n    user-select: none;\r\n  }\r\n  .budget-tile:hover { border-color: var(--gold-light); background: rgba(245,237,216,0.4); }\r\n  .budget-tile.selected { border-color: var(--gold); background: var(--gold-pale); }\r\n  .budget-range { font-size: 14px; font-weight: 500; color: var(--ink); }\r\n  .budget-desc { font-size: 11px; color: var(--stone); margin-top: 4px; font-weight: 300; }\r\n\r\n  \/* Notice *\/\r\n  .notice {\r\n    background: var(--gold-pale);\r\n    border-left: 2px solid var(--gold);\r\n    padding: 12px 16px;\r\n    border-radius: 0 4px 4px 0;\r\n    font-size: 13px;\r\n    color: var(--stone);\r\n    line-height: 1.6;\r\n    margin-top: 1.25rem;\r\n    font-weight: 300;\r\n  }\r\n\r\n  \/* Buttons *\/\r\n  .btn {\r\n    padding: 13px 32px;\r\n    background: var(--gold);\r\n    color: #fff;\r\n    border: none;\r\n    border-radius: 3px;\r\n    font-family: 'Roboto', sans-serif;\r\n    font-size: 11px;\r\n    font-weight: 400;\r\n    letter-spacing: 0.16em;\r\n    text-transform: uppercase;\r\n    cursor: pointer;\r\n    transition: background 0.2s, transform 0.1s;\r\n  }\r\n  .btn:hover { background: var(--gold-deep); }\r\n  .btn:active { transform: scale(0.98); }\r\n  .btn-outline {\r\n    background: transparent;\r\n    border: 0.5px solid var(--gold);\r\n    color: var(--gold);\r\n  }\r\n  .btn-outline:hover { background: var(--gold-pale); }\r\n\r\n  .nav-btns {\r\n    display: flex;\r\n    gap: 12px;\r\n    justify-content: flex-end;\r\n    margin-top: 2rem;\r\n    padding-top: 1.75rem;\r\n    border-top: 0.5px solid var(--border);\r\n  }\r\n\r\n  \/* Summary *\/\r\n  .summary-card {\r\n    border: 0.5px solid var(--border);\r\n    border-radius: 6px;\r\n    overflow: hidden;\r\n    margin-bottom: 1rem;\r\n  }\r\n  .summary-head {\r\n    background: var(--ink);\r\n    padding: 12px 20px;\r\n    font-family: 'Roboto Slab', serif;\r\n    font-size: 16px;\r\n    font-weight: 400;\r\n    color: var(--gold-light);\r\n    letter-spacing: 0.06em;\r\n  }\r\n  .summary-body { background: var(--smoke); }\r\n  .summary-section { padding: 16px 20px; border-bottom: 0.5px solid var(--border); }\r\n  .summary-section:last-child { border-bottom: none; }\r\n  .summary-section-title {\r\n    font-size: 9px;\r\n    letter-spacing: 0.2em;\r\n    text-transform: uppercase;\r\n    color: var(--gold);\r\n    margin-bottom: 10px;\r\n    font-weight: 500;\r\n  }\r\n  .summary-row {\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: baseline;\r\n    padding: 5px 0;\r\n    font-size: 13px;\r\n    border-bottom: 0.5px solid rgba(184,146,58,0.1);\r\n  }\r\n  .summary-row:last-child { border-bottom: none; }\r\n  .summary-key { color: var(--stone); font-weight: 300; }\r\n  .summary-val { font-weight: 500; color: var(--ink); max-width: 55%; text-align: right; }\r\n\r\n  \/* Char count *\/\r\n  .char-count {\r\n    font-size: 11px;\r\n    color: var(--stone);\r\n    text-align: right;\r\n    margin-top: 5px;\r\n    font-weight: 300;\r\n  }\r\n\r\n  \/* Progress *\/\r\n  .progress-bar {\r\n    height: 2px;\r\n    background: var(--border);\r\n    border-radius: 2px;\r\n    margin-bottom: 2rem;\r\n    overflow: hidden;\r\n  }\r\n  .progress-fill {\r\n    height: 100%;\r\n    background: var(--gold);\r\n    border-radius: 2px;\r\n    transition: width 0.4s ease;\r\n  }\r\n\r\n  \/* Section title *\/\r\n  .section-title {\r\n    font-family: 'Roboto Slab', serif;\r\n    font-size: 22px;\r\n    font-weight: 300;\r\n    color: var(--ink);\r\n    margin-bottom: 4px;\r\n    letter-spacing: -0.01em;\r\n  }\r\n  .section-sub {\r\n    font-size: 12px;\r\n    color: var(--stone);\r\n    font-weight: 300;\r\n    margin-bottom: 1.75rem;\r\n    padding-bottom: 1.25rem;\r\n    border-bottom: 0.5px solid var(--border);\r\n  }\r\n\r\n  \/* Success *\/\r\n  .success-state {\r\n    text-align: center;\r\n    padding: 3rem 1rem;\r\n  }\r\n  .success-gem {\r\n    width: 72px;\r\n    height: 72px;\r\n    margin: 0 auto 1.75rem;\r\n    background: var(--gold-pale);\r\n    border: 0.5px solid var(--border);\r\n    border-radius: 50%;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n  .success-title {\r\n    font-family: 'Roboto Slab', serif;\r\n    font-size: 34px;\r\n    font-weight: 300;\r\n    color: var(--ink);\r\n    margin-bottom: 12px;\r\n  }\r\n  .success-sub {\r\n    font-size: 14px;\r\n    color: var(--stone);\r\n    line-height: 1.7;\r\n    font-weight: 300;\r\n    max-width: 380px;\r\n    margin: 0 auto;\r\n  }\r\n  .success-ref {\r\n    margin-top: 2rem;\r\n    display: inline-block;\r\n    background: var(--gold-pale);\r\n    border: 0.5px solid var(--border);\r\n    padding: 10px 24px;\r\n    border-radius: 3px;\r\n    font-size: 13px;\r\n    color: var(--gold-deep);\r\n    letter-spacing: 0.06em;\r\n  }\r\n\r\n  \/* Footer *\/\r\n  .page-footer {\r\n    text-align: center;\r\n    padding: 24px;\r\n    font-size: 11px;\r\n    color: var(--stone);\r\n    letter-spacing: 0.06em;\r\n    font-weight: 300;\r\n    border-top: 0.5px solid var(--border);\r\n    margin-top: 2rem;\r\n  }\r\n\r\n  \/* Responsive *\/\r\n  @media (max-width: 600px) {\r\n    .container { padding: 16px 12px 40px; }\r\n    .form-card { padding: 1.25rem 1rem; }\r\n\r\n    \/* Hero *\/\r\n    .hero { padding: 1.5rem 0 1.25rem; margin-bottom: 1.25rem; }\r\n    .hero-title { font-size: 24px; letter-spacing: 0; }\r\n    .hero-sub { font-size: 12px; line-height: 1.6; }\r\n    .hero-tag { font-size: 9px; letter-spacing: 0.2em; }\r\n\r\n    \/* Steps *\/\r\n    .steps { margin-bottom: 1rem; }\r\n    .step { padding: 7px 2px; font-size: 7.5px; letter-spacing: 0.04em; }\r\n    .step-num { font-size: 15px; margin-bottom: 2px; }\r\n\r\n    \/* Progress *\/\r\n    .progress-bar { margin-bottom: 1rem; }\r\n\r\n    \/* Section *\/\r\n    .section-title { font-size: 17px; }\r\n    .section-sub { font-size: 11px; margin-bottom: 1rem; padding-bottom: 0.875rem; }\r\n    .field-label { font-size: 9px; letter-spacing: 0.15em; margin-bottom: 8px; }\r\n    .field-group { margin-bottom: 1.1rem; }\r\n\r\n    \/* Inputs \u2014 prevent text overflow *\/\r\n    input[type=text],\r\ninput[type=email],\r\ninput[type=tel],\r\ninput[type=date],\r\nselect {\r\n      font-size: 12px;\r\n      padding: 9px 10px;\r\n      text-overflow: ellipsis;\r\n      white-space: nowrap;\r\n      overflow: hidden;\r\n    }\r\n    input[type=text]::placeholder,\r\n    input[type=email]::placeholder,\r\n    input[type=tel]::placeholder {\r\n      font-size: 11px;\r\n      overflow: hidden;\r\n      text-overflow: ellipsis;\r\n      white-space: nowrap;\r\n    }\r\n    textarea {\r\n      font-size: 12px;\r\n      min-height: 80px;\r\n      padding: 9px 10px;\r\n      line-height: 1.6;\r\n    }\r\n    textarea::placeholder { font-size: 11px; line-height: 1.5; }\r\n\r\n    \/* Jewellery type tiles \u2014 3 per row *\/\r\n    .tile-group { grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 8px; }\r\n    .tile { padding: 10px 4px 8px; border-radius: 4px; }\r\n    .tile-icon { font-size: 20px; margin-bottom: 4px; }\r\n    .tile-name { font-size: 10px; letter-spacing: 0; }\r\n    .tile-sub { font-size: 9px; margin-top: 2px; }\r\n\r\n    \/* Metal tiles \u2014 2 per row *\/\r\n    #metal-tiles { grid-template-columns: repeat(2, 1fr); }\r\n    #metal-tiles .tile { padding: 12px 8px; }\r\n\r\n    \/* Budget \u2014 1 per row for breathing room *\/\r\n    .budget-group { grid-template-columns: 1fr; gap: 6px; margin-top: 8px; }\r\n    .budget-tile { padding: 10px 14px; display: flex; align-items: center; justify-content: space-between; }\r\n    .budget-range { font-size: 13px; }\r\n    .budget-desc { font-size: 11px; margin-top: 0; text-align: right; }\r\n\r\n    \/* Rows *\/\r\n    .row2 { grid-template-columns: 1fr; gap: 0; }\r\n\r\n    \/* Buttons *\/\r\n    .btn { padding: 11px 18px; font-size: 10px; letter-spacing: 0.12em; }\r\n    .nav-btns { margin-top: 1.25rem; padding-top: 1.1rem; gap: 8px; }\r\n\r\n    \/* Summary *\/\r\n    .summary-section { padding: 12px 14px; }\r\n    .summary-row { font-size: 11px; }\r\n    .summary-val { max-width: 58%; font-size: 11px; }\r\n\r\n    \/* Char count *\/\r\n    .char-count { font-size: 10px; }\r\n\r\n    \/* Footer *\/\r\n    .page-footer { font-size: 10px; padding: 14px; }\r\n\r\n    \/* Consultation tiles \u2014 force 2x2 *\/\r\n    #consult-tiles { grid-template-columns: repeat(2, 1fr); gap: 6px; }\r\n    #consult-tiles .tile { padding: 10px 6px; white-space: nowrap; }\r\n    #consult-tiles .tile-name { font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\r\n\r\n    \/* Dropdowns \u2014 reduce height *\/\r\n    select { font-size: 12px; padding: 9px 10px; height: auto; }\r\n\r\n    \/* Gem tiles \u2014 3 per row *\/\r\n    #gem-tiles { grid-template-columns: repeat(3, 1fr); gap: 6px; }\r\n    #gem-tiles .tile { padding: 9px 4px; }\r\n    #gem-tiles .tile-name { font-size: 10px; }\r\n\r\n    \/* Upload *\/\r\n    .upload-area { padding: 16px 12px; }\r\n    .upload-icon { font-size: 22px; margin-bottom: 6px; }\r\n    .upload-label-main { font-size: 12px; }\r\n    .upload-label-sub { font-size: 10px; }\r\n  }\r\n\r\n  \/* Upload field *\/\r\n  .upload-area {\r\n    border: 1px dashed rgba(184,146,58,0.45);\r\n    border-radius: 4px;\r\n    background: #fdfcfa;\r\n    padding: 24px 20px;\r\n    text-align: center;\r\n    cursor: pointer;\r\n    transition: all 0.2s;\r\n    position: relative;\r\n  }\r\n  .upload-area:hover, .upload-area.drag-over {\r\n    border-color: var(--gold);\r\n    background: rgba(245,237,216,0.35);\r\n  }\r\n  .upload-icon { font-size: 28px; margin-bottom: 8px; display: block; }\r\n  .upload-label-main {\r\n    font-size: 13px;\r\n    color: var(--ink);\r\n    font-weight: 400;\r\n    display: block;\r\n    margin-bottom: 4px;\r\n  }\r\n  .upload-label-sub {\r\n    font-size: 11px;\r\n    color: var(--stone);\r\n    font-weight: 300;\r\n  }\r\n  .upload-label-sub span {\r\n    color: var(--gold);\r\n    font-weight: 400;\r\n    text-decoration: underline;\r\n    cursor: pointer;\r\n  }\r\n  .upload-area input[type=file] {\r\n    position: absolute;\r\n    inset: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    opacity: 0;\r\n    cursor: pointer;\r\n    border: none;\r\n    padding: 0;\r\n    box-shadow: none;\r\n  }\r\n  .upload-area input[type=file]:focus { box-shadow: none; }\r\n  .upload-previews {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    gap: 10px;\r\n    margin-top: 12px;\r\n  }\r\n  .upload-thumb {\r\n    position: relative;\r\n    width: 72px;\r\n    height: 72px;\r\n    border-radius: 4px;\r\n    overflow: hidden;\r\n    border: 0.5px solid var(--border);\r\n  }\r\n  .upload-thumb img, .upload-thumb video {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n  }\r\n  .upload-thumb-remove {\r\n    position: absolute;\r\n    top: 2px;\r\n    right: 2px;\r\n    width: 18px;\r\n    height: 18px;\r\n    background: rgba(26,20,16,0.7);\r\n    border-radius: 50%;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    cursor: pointer;\r\n    font-size: 10px;\r\n    color: #fff;\r\n    line-height: 1;\r\n  }\r\n  .upload-thumb-file {\r\n    width: 72px;\r\n    height: 72px;\r\n    border-radius: 4px;\r\n    border: 0.5px solid var(--border);\r\n    background: var(--gold-pale);\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    justify-content: center;\r\n    font-size: 10px;\r\n    color: var(--gold-deep);\r\n    gap: 4px;\r\n    padding: 4px;\r\n    text-align: center;\r\n    word-break: break-all;\r\n  }\r\n\r\n  \/* Animations *\/\r\n  @keyframes fadeUp {\r\n    from { opacity: 0; transform: translateY(12px); }\r\n    to { opacity: 1; transform: translateY(0); }\r\n  }\r\n  .section.visible { animation: fadeUp 0.3s ease; }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n\r\n<div class=\"container\">\r\n\r\n  <div class=\"hero\">\r\n    <p class=\"hero-tag\">Shaidee Amore<\/p>\r\n    <h1 class=\"hero-title\">Create Your <em>Signature<\/em><br>Piece<\/h1>\r\n    <p class=\"hero-sub\">Every piece handcrafted to your vision.<br>Share your dream \u2014 we'll bring it to life.<\/p>\r\n  <\/div>\r\n\r\n  <div class=\"steps\">\r\n    <div class=\"step active\" id=\"s1\"><span class=\"step-num\">01<\/span>Design<\/div>\r\n    <div class=\"step\" id=\"s2\"><span class=\"step-num\">02<\/span>Details<\/div>\r\n    <div class=\"step\" id=\"s3\"><span class=\"step-num\">03<\/span>Contact<\/div>\r\n    <div class=\"step\" id=\"s4\"><span class=\"step-num\">04<\/span>Review<\/div>\r\n  <\/div>\r\n\r\n  <div class=\"progress-bar\"><div class=\"progress-fill\" id=\"progress\" style=\"width:25%\"><\/div><\/div>\r\n\r\n  <div class=\"form-card\">\r\n\r\n    <!-- SECTION 1: DESIGN -->\r\n    <div class=\"section visible\" id=\"sec1\">\r\n      <p class=\"section-title\">Design Preferences<\/p>\r\n      <p class=\"section-sub\">Tell us what kind of piece you have in mind.<\/p>\r\n\r\n      <div class=\"field-group\">\r\n        <label class=\"field-label\">Jewellery Type <span class=\"req\">*<\/span><\/label>\r\n        <div class=\"tile-group\" id=\"type-tiles\">\r\n          <div class=\"tile\" data-val=\"Ring\"><span class=\"tile-icon\">\ud83d\udc8d<\/span><span class=\"tile-name\">Ring<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Necklace\"><span class=\"tile-icon\">\ud83d\udcff<\/span><span class=\"tile-name\">Necklace<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Earrings\"><span class=\"tile-icon\">\u2728<\/span><span class=\"tile-name\">Earrings<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Bracelet\"><span class=\"tile-icon\">\u231a<\/span><span class=\"tile-name\">Bracelet<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Pendant\"><span class=\"tile-icon\">\ud83d\udd2e<\/span><span class=\"tile-name\">Pendant<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Mangalsutra\"><span class=\"tile-icon\">\ud83e\udeac<\/span><span class=\"tile-name\">Mangalsutra<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Bangles\"><span class=\"tile-icon\">\ud83e\ude99<\/span><span class=\"tile-name\">Bangles<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Other\"><span class=\"tile-icon\">\uff0b<\/span><span class=\"tile-name\">Other<\/span><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"field-group\">\r\n        <label class=\"field-label\">Metal Preference <span class=\"req\">*<\/span><\/label>\r\n        <div class=\"tile-group\" id=\"metal-tiles\">\r\n          <div class=\"tile\" data-val=\"Yellow Gold\"><span class=\"tile-name\">Yellow Gold<\/span><div class=\"tile-sub\">22K \/ 18K<\/div><\/div>\r\n          <div class=\"tile\" data-val=\"White Gold\"><span class=\"tile-name\">White Gold<\/span><div class=\"tile-sub\">18K<\/div><\/div>\r\n          <div class=\"tile\" data-val=\"Rose Gold\"><span class=\"tile-name\">Rose Gold<\/span><div class=\"tile-sub\">18K<\/div><\/div>\r\n          <div class=\"tile\" data-val=\"Silver\"><span class=\"tile-name\">Silver<\/span><div class=\"tile-sub\">925 Sterling<\/div><\/div>\r\n          <div class=\"tile\" data-val=\"Platinum\"><span class=\"tile-name\">Platinum<\/span><div class=\"tile-sub\">950<\/div><\/div>\r\n          <div class=\"tile\" data-val=\"Not Sure\"><span class=\"tile-name\">Not Sure<\/span><div class=\"tile-sub\">We'll guide you<\/div><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"field-group\">\r\n        <label class=\"field-label\">Occasion<\/label>\r\n        <select id=\"occasion\">\r\n          <option value=\"\">Select occasion (optional)<\/option>\r\n          <option>Wedding \/ Engagement<\/option>\r\n          <option>Anniversary<\/option>\r\n          <option>Birthday<\/option>\r\n          <option>Festival \/ Puja<\/option>\r\n          <option>Everyday Wear<\/option>\r\n          <option>Corporate \/ Gifting<\/option>\r\n          <option>Just Because<\/option>\r\n        <\/select>\r\n      <\/div>\r\n\r\n      <div class=\"nav-btns\">\r\n        <button class=\"btn\" onclick=\"goTo(2)\">Continue \u2192<\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- SECTION 2: DETAILS -->\r\n    <div class=\"section\" id=\"sec2\">\r\n      <p class=\"section-title\">Design Details<\/p>\r\n      <p class=\"section-sub\">Help our artisans understand your vision.<\/p>\r\n\r\n      <div class=\"field-group\">\r\n        <label class=\"field-label\">Describe Your Vision <span class=\"req\">*<\/span><\/label>\r\n        <textarea id=\"vision\" placeholder=\"Describe your design, style or inspiration\u2026\" maxlength=\"500\" oninput=\"document.getElementById('vis-count').textContent=this.value.length+'\/500'\"><\/textarea>\r\n        <div class=\"char-count\" id=\"vis-count\">0\/500<\/div>\r\n      <\/div>\r\n\r\n      <div class=\"field-group\">\r\n        <label class=\"field-label\">Reference Images \/ Videos<\/label>\r\n        <div class=\"upload-area\" id=\"upload-area\" ondragover=\"handleDragOver(event)\" ondragleave=\"handleDragLeave(event)\" ondrop=\"handleDrop(event)\">\r\n          <input type=\"file\" id=\"ref-files\" accept=\"image\/*,video\/*\" multiple onchange=\"handleFiles(this.files)\">\r\n          <span class=\"upload-icon\">\ud83d\uddbc\ufe0f<\/span>\r\n          <span class=\"upload-label-main\">Drag & drop photos or videos here<\/span>\r\n          <span class=\"upload-label-sub\">or <span onclick=\"document.getElementById('ref-files').click()\">browse to upload<\/span> &nbsp;\u00b7&nbsp; JPG, PNG, MP4, MOV &nbsp;\u00b7&nbsp; Max 5 files<\/span>\r\n        <\/div>\r\n        <div class=\"upload-previews\" id=\"upload-previews\"><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"field-group\">\r\n        <label class=\"field-label\">Gemstone Preference<\/label>\r\n        <div class=\"tile-group\" id=\"gem-tiles\">\r\n          <div class=\"tile\" data-val=\"Diamond\"><span class=\"tile-name\">Diamond<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Ruby\"><span class=\"tile-name\">Ruby<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Emerald\"><span class=\"tile-name\">Emerald<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Sapphire\"><span class=\"tile-name\">Sapphire<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Pearl\"><span class=\"tile-name\">Pearl<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"No Stone\"><span class=\"tile-name\">No Stone<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Not Sure\"><span class=\"tile-name\">Not Sure<\/span><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"row2\">\r\n        <div class=\"field-group\">\r\n          <label class=\"field-label\">Size \/ Measurement<\/label>\r\n          <input type=\"text\" id=\"size\" placeholder=\"e.g. Ring size 14 \/ wrist 16cm\">\r\n        <\/div>\r\n        <div class=\"field-group\">\r\n          <label class=\"field-label\">Engraving \/ Text<\/label>\r\n          <input type=\"text\" id=\"engrave\" placeholder=\"e.g. Forever Yours\">\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"field-group\">\r\n        <label class=\"field-label\">Budget Range <span class=\"req\">*<\/span><\/label>\r\n        <div class=\"budget-group\" id=\"budget-tiles\">\r\n          <div class=\"budget-tile\" data-val=\"Under \u20b910,000\"><div class=\"budget-range\">Under \u20b910,000<\/div><div class=\"budget-desc\">Silver, minimal stone work<\/div><\/div>\r\n          <div class=\"budget-tile\" data-val=\"\u20b910,000 \u2013 \u20b930,000\"><div class=\"budget-range\">\u20b910K \u2013 \u20b930K<\/div><div class=\"budget-desc\">Gold, semi-precious stones<\/div><\/div>\r\n          <div class=\"budget-tile\" data-val=\"\u20b930,000 \u2013 \u20b91,00,000\"><div class=\"budget-range\">\u20b930K \u2013 \u20b91L<\/div><div class=\"budget-desc\">Gold with diamonds<\/div><\/div>\r\n          <div class=\"budget-tile\" data-val=\"Above \u20b91,00,000\"><div class=\"budget-range\">Above \u20b91,00,000<\/div><div class=\"budget-desc\">Premium \/ Bridal<\/div><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"field-group\">\r\n        <label class=\"field-label\">Expected Delivery Date<\/label>\r\n        <input type=\"date\" id=\"delivery\">\r\n      <\/div>\r\n\r\n      <div class=\"nav-btns\">\r\n        <button class=\"btn btn-outline\" onclick=\"goTo(1)\">\u2190 Back<\/button>\r\n        <button class=\"btn\" onclick=\"goTo(3)\">Continue \u2192<\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- SECTION 3: CONTACT -->\r\n    <div class=\"section\" id=\"sec3\">\r\n      <p class=\"section-title\">Your Details<\/p>\r\n      <p class=\"section-sub\">How shall our design consultant reach you?<\/p>\r\n\r\n      <div class=\"row2\">\r\n        <div class=\"field-group\">\r\n          <label class=\"field-label\">Your Name <span class=\"req\">*<\/span><\/label>\r\n          <input type=\"text\" id=\"name\" placeholder=\"Full name\">\r\n        <\/div>\r\n        <div class=\"field-group\">\r\n          <label class=\"field-label\">Phone Number <span class=\"req\">*<\/span><\/label>\r\n          <input type=\"tel\" id=\"phone\" placeholder=\"+91 98765 43210\">\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"field-group\">\r\n        <label class=\"field-label\">Email Address<\/label>\r\n        <input type=\"email\" id=\"email\" placeholder=\"your@email.com\">\r\n      <\/div>\r\n\r\n      <div class=\"field-group\">\r\n        <label class=\"field-label\">Preferred Consultation Mode<\/label>\r\n        <div class=\"tile-group\" id=\"consult-tiles\">\r\n          <div class=\"tile\" data-val=\"WhatsApp Call\"><span class=\"tile-name\">WhatsApp Call<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"Phone Call\"><span class=\"tile-name\">Phone Call<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"In-Person Visit\"><span class=\"tile-name\">Visit Store<\/span><\/div>\r\n          <div class=\"tile\" data-val=\"WhatsApp Chat\"><span class=\"tile-name\">WhatsApp Chat<\/span><\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"row2\">\r\n        <div class=\"field-group\">\r\n          <label class=\"field-label\">Best Time to Reach You<\/label>\r\n          <select id=\"timing\">\r\n            <option value=\"\">Any time<\/option>\r\n            <option>Morning (9am \u2013 12pm)<\/option>\r\n            <option>Afternoon (12pm \u2013 4pm)<\/option>\r\n            <option>Evening (4pm \u2013 8pm)<\/option>\r\n          <\/select>\r\n        <\/div>\r\n        <div class=\"field-group\">\r\n          <label class=\"field-label\">How Did You Hear About Us?<\/label>\r\n          <select id=\"source\">\r\n            <option value=\"\">Select one<\/option>\r\n            <option>Instagram<\/option>\r\n            <option>Facebook<\/option>\r\n            <option>Google Search<\/option>\r\n            <option>Friend \/ Family<\/option>\r\n            <option>Repeat Customer<\/option>\r\n            <option>Other<\/option>\r\n          <\/select>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"nav-btns\">\r\n        <button class=\"btn btn-outline\" onclick=\"goTo(2)\">\u2190 Back<\/button>\r\n        <button class=\"btn\" onclick=\"goTo(4)\">Review Order \u2192<\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- SECTION 4: REVIEW -->\r\n    <div class=\"section\" id=\"sec4\">\r\n      <p class=\"section-title\">Review Your Enquiry<\/p>\r\n      <p class=\"section-sub\">Please confirm your details before submitting.<\/p>\r\n\r\n      <div class=\"summary-card\">\r\n        <div class=\"summary-head\">Order Summary<\/div>\r\n        <div class=\"summary-body\" id=\"summary-content\"><\/div>\r\n      <\/div>\r\n\r\n      <div class=\"notice\">\r\n        Your enquiry will be reviewed and a design consultant will contact you within <strong>24 hours<\/strong> to discuss your piece in detail and share a personalised quote.\r\n      <\/div>\r\n\r\n      <div class=\"nav-btns\">\r\n        <button class=\"btn btn-outline\" onclick=\"goTo(3)\">\u2190 Edit Details<\/button>\r\n        <button class=\"btn\" onclick=\"submitForm()\">Submit Enquiry \u2726<\/button>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- SECTION 5: SUCCESS -->\r\n    <div class=\"section\" id=\"sec5\">\r\n      <div class=\"success-state\">\r\n        <div class=\"success-gem\">\r\n          <svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n            <polygon points=\"16,3 28,11 24,27 8,27 4,11\" fill=\"#D4AF6A\" opacity=\"0.35\"\/>\r\n            <polygon points=\"16,3 28,11 24,27 8,27 4,11\" stroke=\"#B8923A\" stroke-width=\"1\" fill=\"none\"\/>\r\n            <line x1=\"16\" y1=\"3\" x2=\"8\" y2=\"27\" stroke=\"#B8923A\" stroke-width=\"0.75\" opacity=\"0.6\"\/>\r\n            <line x1=\"16\" y1=\"3\" x2=\"24\" y2=\"27\" stroke=\"#B8923A\" stroke-width=\"0.75\" opacity=\"0.6\"\/>\r\n            <line x1=\"4\" y1=\"11\" x2=\"28\" y2=\"11\" stroke=\"#B8923A\" stroke-width=\"0.75\" opacity=\"0.6\"\/>\r\n          <\/svg>\r\n        <\/div>\r\n        <h2 class=\"success-title\">Enquiry Received<\/h2>\r\n        <p class=\"success-sub\">Thank you for your interest. Our design consultant will reach out within <strong>24 hours<\/strong> to guide you through the creation process.<\/p>\r\n        <div class=\"ornament\" style=\"margin: 1.75rem 0;\">\r\n          <div class=\"ornament-line\"><\/div>\r\n          <div class=\"ornament-gem-sm\"><\/div>\r\n          <div class=\"ornament-gem\"><\/div>\r\n          <div class=\"ornament-gem-sm\"><\/div>\r\n          <div class=\"ornament-line r\"><\/div>\r\n        <\/div>\r\n        <p style=\"font-size:13px;color:var(--stone);font-weight:300;\">In the meantime, feel free to browse our lookbook for inspiration.<\/p>\r\n        <div class=\"success-ref\" id=\"ref-num\"><\/div>\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div><!-- \/form-card -->\r\n\r\n<\/div><!-- \/container -->\r\n\r\n<footer class=\"page-footer\">\r\n  Handcrafted with care &nbsp;\u2726&nbsp; Every piece is unique, just like you\r\n<\/footer>\r\n\r\n<script>\r\n  const state = {\r\n    type: '', metal: '', gem: '', consult: '', budget: '',\r\n    occasion: '', vision: '', size: '', engrave: '',\r\n    delivery: '', name: '', phone: '', email: '', timing: '', source: '',\r\n    refFiles: []\r\n  };\r\n\r\n  const progressMap = { 1: 25, 2: 50, 3: 75, 4: 100 };\r\n\r\n  function tileGroup(id, key) {\r\n    const container = document.getElementById(id);\r\n    if (!container) return;\r\n    container.querySelectorAll('.tile, .budget-tile').forEach(t => {\r\n      t.addEventListener('click', () => {\r\n        container.querySelectorAll('.tile, .budget-tile').forEach(x => x.classList.remove('selected'));\r\n        t.classList.add('selected');\r\n        state[key] = t.dataset.val;\r\n      });\r\n    });\r\n  }\r\n\r\n  tileGroup('type-tiles', 'type');\r\n  tileGroup('metal-tiles', 'metal');\r\n  tileGroup('gem-tiles', 'gem');\r\n  tileGroup('consult-tiles', 'consult');\r\n  tileGroup('budget-tiles', 'budget');\r\n\r\n  function goTo(n) {\r\n    \/\/ Validation\r\n    if (n === 2) {\r\n      if (!state.type) { alert('Please select a jewellery type.'); return; }\r\n      if (!state.metal) { alert('Please select a metal preference.'); return; }\r\n    }\r\n    if (n === 3) {\r\n      const v = document.getElementById('vision').value.trim();\r\n      if (!v) { alert('Please describe your vision.'); return; }\r\n      if (!state.budget) { alert('Please select a budget range.'); return; }\r\n      state.vision = document.getElementById('vision').value;\r\n      state.size = document.getElementById('size').value;\r\n      state.engrave = document.getElementById('engrave').value;\r\n      state.delivery = document.getElementById('delivery').value;\r\n      state.occasion = document.getElementById('occasion').value;\r\n    }\r\n    if (n === 4) {\r\n      if (!document.getElementById('name').value.trim()) { alert('Please enter your name.'); return; }\r\n      if (!document.getElementById('phone').value.trim()) { alert('Please enter your phone number.'); return; }\r\n      state.name = document.getElementById('name').value;\r\n      state.phone = document.getElementById('phone').value;\r\n      state.email = document.getElementById('email').value;\r\n      state.timing = document.getElementById('timing').value;\r\n      state.source = document.getElementById('source').value;\r\n      buildSummary();\r\n    }\r\n\r\n    \/\/ Update sections\r\n    [1,2,3,4,5].forEach(i => {\r\n      document.getElementById('sec'+i).classList.toggle('visible', i === n);\r\n    });\r\n\r\n    \/\/ Update step bar\r\n    [1,2,3,4].forEach(i => {\r\n      const el = document.getElementById('s'+i);\r\n      if (!el) return;\r\n      el.classList.toggle('active', i === n);\r\n      el.classList.toggle('done', i < n);\r\n    });\r\n\r\n    \/\/ Progress bar\r\n    const prog = progressMap[n] || 100;\r\n    document.getElementById('progress').style.width = prog + '%';\r\n\r\n    window.scrollTo({ top: 0, behavior: 'smooth' });\r\n  }\r\n\r\n  function buildSummary() {\r\n    const sections = [\r\n      {\r\n        title: 'Design',\r\n        rows: [\r\n          ['Jewellery Type', state.type],\r\n          ['Metal', state.metal],\r\n          ['Occasion', state.occasion || '\u2014'],\r\n        ]\r\n      },\r\n      {\r\n        title: 'Details',\r\n        rows: [\r\n          ['Vision', state.vision.length > 80 ? state.vision.substring(0, 80) + '\u2026' : state.vision],\r\n          ['Reference Files', state.refFiles.length ? state.refFiles.length + ' file(s) attached' : '\u2014'],\r\n          ['Gemstone', state.gem || '\u2014'],\r\n          ['Size \/ Measurement', state.size || '\u2014'],\r\n          ['Engraving', state.engrave || '\u2014'],\r\n          ['Budget', state.budget],\r\n          ['Expected Delivery', state.delivery || '\u2014'],\r\n        ]\r\n      },\r\n      {\r\n        title: 'Contact',\r\n        rows: [\r\n          ['Name', state.name],\r\n          ['Phone', state.phone],\r\n          ['Email', state.email || '\u2014'],\r\n          ['Consultation Mode', state.consult || '\u2014'],\r\n          ['Best Time', state.timing || 'Any time'],\r\n          ['Referred By', state.source || '\u2014'],\r\n        ]\r\n      }\r\n    ];\r\n\r\n    document.getElementById('summary-content').innerHTML = sections.map(s => `\r\n      <div class=\"summary-section\">\r\n        <div class=\"summary-section-title\">${s.title}<\/div>\r\n        ${s.rows.map(([k, v]) => `\r\n          <div class=\"summary-row\">\r\n            <span class=\"summary-key\">${k}<\/span>\r\n            <span class=\"summary-val\">${v}<\/span>\r\n          <\/div>\r\n        `).join('')}\r\n      <\/div>\r\n    `).join('');\r\n  }\r\n\r\n  \/\/ File upload handling\r\n  function handleFiles(files) {\r\n    const remaining = 5 - state.refFiles.length;\r\n    const toAdd = Array.from(files).slice(0, remaining);\r\n    toAdd.forEach(f => state.refFiles.push(f));\r\n    renderPreviews();\r\n  }\r\n\r\n  function renderPreviews() {\r\n    const container = document.getElementById('upload-previews');\r\n    container.innerHTML = '';\r\n    state.refFiles.forEach((f, i) => {\r\n      const isImage = f.type.startsWith('image\/');\r\n      const isVideo = f.type.startsWith('video\/');\r\n      if (isImage || isVideo) {\r\n        const url = URL.createObjectURL(f);\r\n        const thumb = document.createElement('div');\r\n        thumb.className = 'upload-thumb';\r\n        thumb.innerHTML = isImage\r\n          ? `<img decoding=\"async\" src=\"${url}\" alt=\"ref\">`\r\n          : `<video src=\"${url}\" muted><\/video>`;\r\n        const rm = document.createElement('div');\r\n        rm.className = 'upload-thumb-remove';\r\n        rm.textContent = '\u2715';\r\n        rm.onclick = () => { state.refFiles.splice(i, 1); renderPreviews(); };\r\n        thumb.appendChild(rm);\r\n        container.appendChild(thumb);\r\n      } else {\r\n        const thumb = document.createElement('div');\r\n        thumb.className = 'upload-thumb-file';\r\n        thumb.innerHTML = `\ud83d\udcce<span>${f.name.slice(0,12)}<\/span>`;\r\n        const rm = document.createElement('div');\r\n        rm.className = 'upload-thumb-remove';\r\n        rm.textContent = '\u2715';\r\n        rm.style.position = 'relative';\r\n        rm.style.inset = 'unset';\r\n        rm.onclick = () => { state.refFiles.splice(i, 1); renderPreviews(); };\r\n        thumb.appendChild(rm);\r\n        container.appendChild(thumb);\r\n      }\r\n    });\r\n    \/\/ Reset file input so same file can be re-selected\r\n    document.getElementById('ref-files').value = '';\r\n  }\r\n\r\n  function handleDragOver(e) {\r\n    e.preventDefault();\r\n    document.getElementById('upload-area').classList.add('drag-over');\r\n  }\r\n  function handleDragLeave(e) {\r\n    document.getElementById('upload-area').classList.remove('drag-over');\r\n  }\r\n  function handleDrop(e) {\r\n    e.preventDefault();\r\n    document.getElementById('upload-area').classList.remove('drag-over');\r\n    handleFiles(e.dataTransfer.files);\r\n  }\r\n\r\nfunction submitForm() {\r\n\r\n  const data = {\r\n    name: state.name,\r\n    phone: state.phone,\r\n    email: state.email,\r\n    type: state.type,\r\n    metal: state.metal,\r\n    gem: state.gem,\r\n    budget: state.budget,\r\n    delivery: state.delivery,\r\n    vision: state.vision\r\n  };\r\n\r\n  fetch(\"https:\/\/formsubmit.co\/ajax\/info@shaideeamore.com\", {\r\n    method: \"POST\",\r\n    headers: {\r\n      'Content-Type': 'application\/json'\r\n    },\r\n    body: JSON.stringify(data)\r\n  })\r\n  .then(response => response.json())\r\n  .then(data => {\r\n      document.getElementById('sec4').classList.remove('visible');\r\n      document.getElementById('sec5').classList.add('visible');\r\n  })\r\n  .catch(error => {\r\n      alert(\"Something went wrong. Please try again.\");\r\n  });\r\n\r\n}\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Jewellery \u2014 Custom Order Enquiry Shaidee Amore Create Your SignaturePiece Every piece handcrafted to your vision.Share your dream \u2014 we&#8217;ll bring it to life. 01Design 02Details 03Contact 04Review Design Preferences Tell us what kind of piece you have in mind. Jewellery Type * \ud83d\udc8dRing \ud83d\udcffNecklace \u2728Earrings \u231aBracelet \ud83d\udd2ePendant \ud83e\udeacMangalsutra \ud83e\ude99Bangles \uff0bOther Metal Preference * Yellow [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1000267","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/shaideeamore.com\/hi\/wp-json\/wp\/v2\/pages\/1000267","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/shaideeamore.com\/hi\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/shaideeamore.com\/hi\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/shaideeamore.com\/hi\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/shaideeamore.com\/hi\/wp-json\/wp\/v2\/comments?post=1000267"}],"version-history":[{"count":7,"href":"https:\/\/shaideeamore.com\/hi\/wp-json\/wp\/v2\/pages\/1000267\/revisions"}],"predecessor-version":[{"id":1000439,"href":"https:\/\/shaideeamore.com\/hi\/wp-json\/wp\/v2\/pages\/1000267\/revisions\/1000439"}],"wp:attachment":[{"href":"https:\/\/shaideeamore.com\/hi\/wp-json\/wp\/v2\/media?parent=1000267"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}