{"id":50630,"date":"2026-04-17T11:33:47","date_gmt":"2026-04-17T09:33:47","guid":{"rendered":"https:\/\/smart-elements.com\/?page_id=50630"},"modified":"2026-04-17T11:43:03","modified_gmt":"2026-04-17T09:43:03","slug":"elementor-50630","status":"publish","type":"page","link":"https:\/\/smart-elements.com\/de\/elementor-50630\/","title":{"rendered":"Elementor #50630"},"content":{"rendered":"
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Smart Elements \u2013 Premium Homepage Mockup<\/title>\r\n <style>\r\n :root {\r\n --bg: #06111a;\r\n --bg-2: #0b1824;\r\n --panel: rgba(10, 24, 36, 0.86);\r\n --panel-2: rgba(13, 29, 44, 0.92);\r\n --line: rgba(93, 131, 162, 0.22);\r\n --text: #eef4f8;\r\n --muted: #97a7b5;\r\n --accent: #19b8ff;\r\n --accent-2: #83deff;\r\n --shadow: 0 24px 80px rgba(0, 0, 0, 0.35);\r\n --radius: 22px;\r\n --radius-sm: 16px;\r\n --max: 1320px;\r\n }\r\n\r\n * { box-sizing: border-box; }\r\n html { scroll-behavior: smooth; }\r\n body {\r\n margin: 0;\r\n font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n color: var(--text);\r\n background:\r\n radial-gradient(circle at 20% 0%, rgba(25,184,255,0.08), transparent 28%),\r\n radial-gradient(circle at 90% 10%, rgba(131,222,255,0.08), transparent 22%),\r\n linear-gradient(180deg, #041019 0%, #07131d 42%, #06111a 100%);\r\n min-height: 100vh;\r\n }\r\n\r\n a { color: inherit; text-decoration: none; }\r\n img { display: block; width: 100%; height: auto; }\r\n\r\n .container {\r\n width: min(calc(100% - 32px), var(--max));\r\n margin: 0 auto;\r\n }\r\n\r\n .topbar {\r\n position: sticky;\r\n top: 0;\r\n z-index: 50;\r\n backdrop-filter: blur(18px);\r\n background: rgba(4, 15, 24, 0.78);\r\n border-bottom: 1px solid rgba(255,255,255,0.05);\r\n }\r\n\r\n .nav {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n gap: 20px;\r\n min-height: 84px;\r\n }\r\n\r\n .brand {\r\n display: flex;\r\n align-items: center;\r\n gap: 14px;\r\n min-width: 220px;\r\n }\r\n\r\n .logo {\r\n width: 44px;\r\n height: 44px;\r\n border: 1px solid rgba(131,222,255,0.5);\r\n border-radius: 14px;\r\n display: grid;\r\n place-items: center;\r\n color: var(--accent-2);\r\n font-weight: 700;\r\n box-shadow: inset 0 0 18px rgba(25,184,255,0.14);\r\n }\r\n\r\n .brand-title {\r\n line-height: 1;\r\n letter-spacing: 0.08em;\r\n font-weight: 800;\r\n }\r\n\r\n .brand-title span { color: var(--accent); }\r\n\r\n .menu {\r\n display: flex;\r\n align-items: center;\r\n gap: 28px;\r\n color: #d2dce4;\r\n font-size: 0.95rem;\r\n }\r\n\r\n .menu a {\r\n opacity: 0.92;\r\n transition: 0.2s ease;\r\n }\r\n\r\n .menu a:hover { color: var(--accent-2); }\r\n\r\n .nav-right {\r\n display: flex;\r\n align-items: center;\r\n gap: 14px;\r\n }\r\n\r\n .search {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n padding: 12px 16px;\r\n min-width: 280px;\r\n border-radius: 999px;\r\n background: rgba(255,255,255,0.03);\r\n border: 1px solid rgba(255,255,255,0.08);\r\n color: var(--muted);\r\n }\r\n\r\n .icon-btn {\r\n width: 42px;\r\n height: 42px;\r\n display: grid;\r\n place-items: center;\r\n border-radius: 50%;\r\n border: 1px solid rgba(255,255,255,0.08);\r\n background: rgba(255,255,255,0.03);\r\n color: #d6e7ef;\r\n }\r\n\r\n .hero {\r\n padding: 34px 0 18px;\r\n }\r\n\r\n .hero-card {\r\n position: relative;\r\n overflow: hidden;\r\n display: grid;\r\n grid-template-columns: 1.05fr 1.2fr;\r\n min-height: 620px;\r\n border-radius: 28px;\r\n background: linear-gradient(135deg, rgba(6,16,25,0.94), rgba(8,20,30,0.84));\r\n border: 1px solid rgba(255,255,255,0.06);\r\n box-shadow: var(--shadow);\r\n isolation: isolate;\r\n }\r\n\r\n .hero-card::before {\r\n content: \"\";\r\n position: absolute;\r\n inset: 0;\r\n background: linear-gradient(90deg, rgba(4,14,23,0.96) 0%, rgba(4,14,23,0.72) 37%, rgba(4,14,23,0.18) 62%, rgba(4,14,23,0.0) 100%);\r\n z-index: 1;\r\n pointer-events: none;\r\n }\r\n\r\n .hero-copy,\r\n .hero-media {\r\n position: relative;\r\n z-index: 2;\r\n }\r\n\r\n .hero-copy {\r\n padding: 72px 56px;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n gap: 22px;\r\n }\r\n\r\n .eyebrow,\r\n .section-label {\r\n color: var(--accent);\r\n text-transform: uppercase;\r\n letter-spacing: 0.14em;\r\n font-size: 0.8rem;\r\n font-weight: 700;\r\n }\r\n\r\n h1 {\r\n margin: 0;\r\n font-size: clamp(2.3rem, 4.6vw, 4.75rem);\r\n line-height: 1.02;\r\n letter-spacing: -0.04em;\r\n max-width: 12ch;\r\n }\r\n\r\n h1 .accent-line { color: var(--accent); }\r\n\r\n .hero-copy p {\r\n margin: 0;\r\n color: #d2dce4;\r\n font-size: 1.1rem;\r\n line-height: 1.7;\r\n max-width: 54ch;\r\n }\r\n\r\n .bullet-row {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: 14px;\r\n margin-top: 2px;\r\n }\r\n\r\n .pill {\r\n padding: 10px 14px;\r\n border-radius: 999px;\r\n border: 1px solid rgba(131,222,255,0.18);\r\n background: rgba(255,255,255,0.03);\r\n color: #eaf8ff;\r\n font-size: 0.95rem;\r\n }\r\n\r\n .cta-row {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: 14px;\r\n margin-top: 10px;\r\n }\r\n\r\n .btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 10px;\r\n min-height: 52px;\r\n padding: 0 22px;\r\n border-radius: 14px;\r\n font-weight: 700;\r\n transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;\r\n border: 1px solid transparent;\r\n }\r\n\r\n .btn:hover { transform: translateY(-1px); }\r\n .btn-primary {\r\n background: linear-gradient(135deg, var(--accent), #0d8dd2);\r\n color: white;\r\n box-shadow: 0 14px 30px rgba(25,184,255,0.24);\r\n }\r\n\r\n .btn-secondary {\r\n background: rgba(255,255,255,0.03);\r\n border-color: rgba(255,255,255,0.11);\r\n color: var(--text);\r\n }\r\n\r\n .hero-media {\r\n min-height: 100%;\r\n background:\r\n linear-gradient(0deg, rgba(4,12,19,0.28), rgba(4,12,19,0.28)),\r\n url('https:\/\/images.unsplash.com\/photo-1517048676732-d65bc937f952?auto=format&fit=crop&w=1400&q=80') center\/cover no-repeat;\r\n }\r\n\r\n .hero-glass {\r\n position: absolute;\r\n right: 42px;\r\n bottom: 42px;\r\n width: min(360px, calc(100% - 64px));\r\n padding: 22px;\r\n border-radius: 24px;\r\n background: rgba(7, 20, 30, 0.72);\r\n border: 1px solid rgba(255,255,255,0.09);\r\n backdrop-filter: blur(14px);\r\n box-shadow: var(--shadow);\r\n }\r\n\r\n .hero-glass .small {\r\n color: var(--accent-2);\r\n text-transform: uppercase;\r\n letter-spacing: 0.12em;\r\n font-size: 0.72rem;\r\n font-weight: 700;\r\n }\r\n\r\n .hero-glass .big {\r\n margin-top: 8px;\r\n font-size: 1.3rem;\r\n font-weight: 800;\r\n }\r\n\r\n .hero-glass .sub {\r\n margin-top: 6px;\r\n color: var(--muted);\r\n line-height: 1.55;\r\n }\r\n\r\n .trustbar {\r\n display: grid;\r\n grid-template-columns: repeat(4, 1fr);\r\n gap: 14px;\r\n padding: 18px 0 8px;\r\n }\r\n\r\n .trust-item {\r\n padding: 18px 18px;\r\n border-radius: 18px;\r\n background: rgba(255,255,255,0.025);\r\n border: 1px solid rgba(255,255,255,0.06);\r\n color: var(--muted);\r\n }\r\n\r\n .trust-item strong {\r\n display: block;\r\n margin-bottom: 6px;\r\n color: var(--text);\r\n font-size: 1rem;\r\n }\r\n\r\n section {\r\n padding: 34px 0;\r\n }\r\n\r\n .section-head {\r\n display: flex;\r\n align-items: end;\r\n justify-content: space-between;\r\n gap: 20px;\r\n margin-bottom: 18px;\r\n }\r\n\r\n .section-head h2 {\r\n margin: 8px 0 0;\r\n font-size: clamp(1.7rem, 3vw, 2.6rem);\r\n line-height: 1.08;\r\n letter-spacing: -0.03em;\r\n }\r\n\r\n .section-head p {\r\n margin: 10px 0 0;\r\n max-width: 60ch;\r\n color: var(--muted);\r\n line-height: 1.7;\r\n }\r\n\r\n .section-link {\r\n color: var(--accent);\r\n font-weight: 700;\r\n white-space: nowrap;\r\n }\r\n\r\n .category-grid,\r\n .product-grid,\r\n .review-grid {\r\n display: grid;\r\n gap: 18px;\r\n }\r\n\r\n .category-grid {\r\n grid-template-columns: repeat(4, 1fr);\r\n }\r\n\r\n .product-grid {\r\n grid-template-columns: repeat(4, 1fr);\r\n }\r\n\r\n .review-grid {\r\n grid-template-columns: repeat(3, 1fr);\r\n }\r\n\r\n .card {\r\n border-radius: var(--radius);\r\n overflow: hidden;\r\n background: linear-gradient(180deg, rgba(12,24,36,0.98), rgba(8,18,28,0.98));\r\n border: 1px solid rgba(255,255,255,0.06);\r\n box-shadow: 0 16px 40px rgba(0,0,0,0.16);\r\n transition: transform 0.18s ease, border-color 0.18s ease;\r\n }\r\n\r\n .card:hover {\r\n transform: translateY(-3px);\r\n border-color: rgba(131,222,255,0.18);\r\n }\r\n\r\n .media {\r\n aspect-ratio: 16\/10;\r\n background-size: cover;\r\n background-position: center;\r\n }\r\n\r\n .card-body { padding: 18px; }\r\n .card-title {\r\n margin: 0 0 6px;\r\n font-size: 1.15rem;\r\n font-weight: 800;\r\n }\r\n\r\n .card-copy,\r\n .meta,\r\n .review-meta {\r\n color: var(--muted);\r\n line-height: 1.6;\r\n }\r\n\r\n .price-row {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n gap: 14px;\r\n margin-top: 16px;\r\n }\r\n\r\n .price {\r\n font-weight: 800;\r\n font-size: 1.08rem;\r\n }\r\n\r\n .mini-btn {\r\n padding: 11px 14px;\r\n border-radius: 12px;\r\n border: 1px solid rgba(255,255,255,0.1);\r\n background: rgba(255,255,255,0.03);\r\n color: var(--text);\r\n font-weight: 700;\r\n font-size: 0.92rem;\r\n }\r\n\r\n .story {\r\n display: grid;\r\n grid-template-columns: 1fr 1.15fr;\r\n gap: 20px;\r\n align-items: stretch;\r\n padding: 26px;\r\n border-radius: 28px;\r\n border: 1px solid rgba(255,255,255,0.06);\r\n background: linear-gradient(180deg, rgba(10,24,36,0.92), rgba(8,18,28,0.96));\r\n overflow: hidden;\r\n }\r\n\r\n .story-copy {\r\n padding: 18px 6px 18px 6px;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n }\r\n\r\n .story-copy h2 { margin: 8px 0 12px; font-size: clamp(1.8rem, 3vw, 2.8rem); }\r\n .story-copy p { color: var(--muted); line-height: 1.8; max-width: 55ch; }\r\n\r\n .story-media {\r\n min-height: 380px;\r\n border-radius: 22px;\r\n background:\r\n linear-gradient(0deg, rgba(4,12,19,0.18), rgba(4,12,19,0.18)),\r\n url('https:\/\/images.unsplash.com\/photo-1532187643603-ba119ca4109e?auto=format&fit=crop&w=1400&q=80') center\/cover no-repeat;\r\n border: 1px solid rgba(255,255,255,0.05);\r\n }\r\n\r\n .stars {\r\n color: #ffd35f;\r\n font-size: 1.1rem;\r\n letter-spacing: 0.12em;\r\n margin-bottom: 12px;\r\n }\r\n\r\n footer {\r\n padding: 24px 0 44px;\r\n }\r\n\r\n .footer-box {\r\n display: grid;\r\n grid-template-columns: 1.1fr repeat(3, 1fr) 1.2fr;\r\n gap: 24px;\r\n padding: 28px;\r\n border-radius: 28px;\r\n background: linear-gradient(180deg, rgba(8,18,28,0.95), rgba(7,16,24,0.98));\r\n border: 1px solid rgba(255,255,255,0.06);\r\n }\r\n\r\n .footer-box h4 {\r\n margin: 0 0 14px;\r\n font-size: 1rem;\r\n }\r\n\r\n .footer-box p,\r\n .footer-box a {\r\n color: var(--muted);\r\n line-height: 1.8;\r\n display: block;\r\n }\r\n\r\n .newsletter {\r\n display: flex;\r\n gap: 10px;\r\n margin-top: 14px;\r\n }\r\n\r\n .newsletter input {\r\n flex: 1;\r\n min-height: 48px;\r\n border-radius: 12px;\r\n border: 1px solid rgba(255,255,255,0.08);\r\n background: rgba(255,255,255,0.03);\r\n color: var(--text);\r\n padding: 0 14px;\r\n outline: none;\r\n }\r\n\r\n .newsletter button {\r\n min-width: 58px;\r\n border-radius: 12px;\r\n border: 0;\r\n background: linear-gradient(135deg, var(--accent), #0d8dd2);\r\n color: white;\r\n font-size: 1.2rem;\r\n cursor: pointer;\r\n }\r\n\r\n .muted-note {\r\n margin-top: 14px;\r\n color: #8293a0;\r\n font-size: 0.9rem;\r\n }\r\n\r\n .mobile-toggle {\r\n display: none;\r\n }\r\n\r\n @media (max-width: 1180px) {\r\n .menu { display: none; }\r\n .search { min-width: 220px; }\r\n .hero-card { grid-template-columns: 1fr; min-height: auto; }\r\n .hero-media { min-height: 420px; }\r\n .hero-card::before {\r\n background: linear-gradient(180deg, rgba(4,14,23,0.94) 0%, rgba(4,14,23,0.72) 42%, rgba(4,14,23,0.22) 74%, rgba(4,14,23,0.14) 100%);\r\n }\r\n .category-grid,\r\n .product-grid { grid-template-columns: repeat(2, 1fr); }\r\n .trustbar { grid-template-columns: repeat(2, 1fr); }\r\n .story { grid-template-columns: 1fr; }\r\n .footer-box { grid-template-columns: repeat(2, 1fr); }\r\n }\r\n\r\n @media (max-width: 760px) {\r\n .nav { min-height: 72px; }\r\n .search { display: none; }\r\n .mobile-toggle { display: grid; }\r\n .hero-copy { padding: 34px 22px 30px; }\r\n .hero-media { min-height: 340px; }\r\n .hero-glass {\r\n position: static;\r\n margin: 18px;\r\n width: auto;\r\n }\r\n .trustbar,\r\n .category-grid,\r\n .product-grid,\r\n .review-grid,\r\n .footer-box { grid-template-columns: 1fr; }\r\n .section-head { align-items: start; flex-direction: column; }\r\n .story { padding: 18px; }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <header class=\"topbar\">\r\n <div class=\"container nav\">\r\n <a href=\"#\" class=\"brand\">\r\n <div class=\"logo\">S<\/div>\r\n <div class=\"brand-title\">SMART<br><span>ELEMENTS<\/span><\/div>\r\n <\/a>\r\n\r\n <nav class=\"menu\" aria-label=\"Primary navigation\">\r\n <a href=\"#categories\">Shop<\/a>\r\n <a href=\"#featured\">Featured<\/a>\r\n <a href=\"#story\">\u00dcber uns<\/a>\r\n <a href=\"#reviews\">Reviews<\/a>\r\n <a href=\"#footer\">Contact<\/a>\r\n <\/nav>\r\n\r\n <div class=\"nav-right\">\r\n <div class=\"search\">Search elements, oxides, cubes\u2026<\/div>\r\n <div class=\"icon-btn mobile-toggle\">\u2630<\/div>\r\n <div class=\"icon-btn\">\ud83d\udc64<\/div>\r\n <div class=\"icon-btn\">\ud83d\uded2<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/header>\r\n\r\n <main>\r\n <section class=\"hero\">\r\n <div class=\"container\">\r\n <div class=\"hero-card\">\r\n <div class=\"hero-copy\">\r\n <div class=\"eyebrow\">Premium scientific materials<\/div>\r\n <h1>\r\n High Purity Elements\r\n <span class=\"accent-line\">for Research, Industry & Collectors<\/span>\r\n <\/h1>\r\n <p>\r\n A premium storefront concept for rare elements, high-purity metals, oxides,\r\n custom pieces, and collector-grade scientific products.\r\n <\/p>\r\n\r\n <div class=\"bullet-row\">\r\n <div class=\"pill\">Certified purity<\/div>\r\n <div class=\"pill\">Worldwide shipping<\/div>\r\n <div class=\"pill\">Hergestellt in \u00d6sterreich<\/div>\r\n <\/div>\r\n\r\n <div class=\"cta-row\">\r\n <a class=\"btn btn-primary\" href=\"#categories\">Explore Elements<\/a>\r\n <a class=\"btn btn-secondary\" href=\"#story\">Custom Request<\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"hero-media\">\r\n <div class=\"hero-glass\">\r\n <div class=\"small\">Featured product direction<\/div>\r\n <div class=\"big\">Luxury element cube presentation<\/div>\r\n <div class=\"sub\">\r\n Large premium imagery, strong contrast, and a dark scientific aesthetic for a\r\n more valuable first impression.\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"trustbar\">\r\n <div class=\"trust-item\"><strong>Lab-grade quality<\/strong>Certified purity & analytical standards<\/div>\r\n <div class=\"trust-item\"><strong>Worldwide shipping<\/strong>Fast and secure international delivery<\/div>\r\n <div class=\"trust-item\"><strong>20+ years of expertise<\/strong>Technical credibility and specialist know-how<\/div>\r\n <div class=\"trust-item\"><strong>Hergestellt in \u00d6sterreich<\/strong>Precision manufacturing and curated sourcing<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"categories\">\r\n <div class=\"container\">\r\n <div class=\"section-head\">\r\n <div>\r\n <div class=\"section-label\">Shop by category<\/div>\r\n <h2>Find the element you need<\/h2>\r\n <p>\r\n Structure the catalog around customer intent, not only chemistry taxonomy.\r\n That makes the store easier to scan and improves conversion for new visitors.\r\n <\/p>\r\n <\/div>\r\n <a class=\"section-link\" href=\"#\">View all elements \u2192<\/a>\r\n <\/div>\r\n\r\n <div class=\"category-grid\">\r\n <article class=\"card\">\r\n <div class=\"media\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1617791160505-6f00504e3519?auto=format&fit=crop&w=1200&q=80')\"><\/div>\r\n <div class=\"card-body\">\r\n <h3 class=\"card-title\">Research Materials<\/h3>\r\n <div class=\"card-copy\">High-purity metals, oxides, compounds and laboratory-grade substances.<\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article class=\"card\">\r\n <div class=\"media\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1581092921461-eab10380d70a?auto=format&fit=crop&w=1200&q=80')\"><\/div>\r\n <div class=\"card-body\">\r\n <h3 class=\"card-title\">Collector Pieces<\/h3>\r\n <div class=\"card-copy\">Element cubes, samples, premium displays and rare conversation objects.<\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article class=\"card\">\r\n <div class=\"media\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1462331940025-496dfbfc7564?auto=format&fit=crop&w=1200&q=80')\"><\/div>\r\n <div class=\"card-body\">\r\n <h3 class=\"card-title\">Rare Earth Elements<\/h3>\r\n <div class=\"card-copy\">Lanthanides, yttrium compounds and niche specialty materials.<\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article class=\"card\">\r\n <div class=\"media\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1582719478250-c89cae4dc85b?auto=format&fit=crop&w=1200&q=80')\"><\/div>\r\n <div class=\"card-body\">\r\n <h3 class=\"card-title\">Custom Solutions<\/h3>\r\n <div class=\"card-copy\">Custom made parts, shaped samples, glass items and special projects.<\/div>\r\n <\/div>\r\n <\/article>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"featured\">\r\n <div class=\"container\">\r\n <div class=\"section-head\">\r\n <div>\r\n <div class=\"section-label\">Featured elements<\/div>\r\n <h2>Premium quality. Exceptional purity.<\/h2>\r\n <\/div>\r\n <a class=\"section-link\" href=\"#\">View shop \u2192<\/a>\r\n <\/div>\r\n\r\n <div class=\"product-grid\">\r\n <article class=\"card\">\r\n <div class=\"media\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1517048676732-d65bc937f952?auto=format&fit=crop&w=1200&q=80')\"><\/div>\r\n <div class=\"card-body\">\r\n <h3 class=\"card-title\">Osmium Cube<\/h3>\r\n <div class=\"meta\">99.95% \u00b7 10 mm \u00b7 Collector edition<\/div>\r\n <div class=\"price-row\"><div class=\"price\">\u20ac249.00<\/div><a class=\"mini-btn\" href=\"#\">Add to cart<\/a><\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article class=\"card\">\r\n <div class=\"media\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1581092334651-ddf26d9a09d0?auto=format&fit=crop&w=1200&q=80')\"><\/div>\r\n <div class=\"card-body\">\r\n <h3 class=\"card-title\">Hafnium Rod<\/h3>\r\n <div class=\"meta\">99.9% \u00b7 \u00d8 5 mm \u00b7 Research material<\/div>\r\n <div class=\"price-row\"><div class=\"price\">\u20ac189.00<\/div><a class=\"mini-btn\" href=\"#\">Add to cart<\/a><\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article class=\"card\">\r\n <div class=\"media\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1518152006812-edab29b069ac?auto=format&fit=crop&w=1200&q=80')\"><\/div>\r\n <div class=\"card-body\">\r\n <h3 class=\"card-title\">Platinum Sponge<\/h3>\r\n <div class=\"meta\">99.95% \u00b7 1 gram \u00b7 High value noble metal<\/div>\r\n <div class=\"price-row\"><div class=\"price\">\u20ac98.00<\/div><a class=\"mini-btn\" href=\"#\">Add to cart<\/a><\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article class=\"card\">\r\n <div class=\"media\" style=\"background-image:url('https:\/\/images.unsplash.com\/photo-1520607162513-77705c0f0d4a?auto=format&fit=crop&w=1200&q=80')\"><\/div>\r\n <div class=\"card-body\">\r\n <h3 class=\"card-title\">Erbium Oxide<\/h3>\r\n <div class=\"meta\">99.99% \u00b7 5 grams \u00b7 Rare earth oxide<\/div>\r\n <div class=\"price-row\"><div class=\"price\">\u20ac124.00<\/div><a class=\"mini-btn\" href=\"#\">Add to cart<\/a><\/div>\r\n <\/div>\r\n <\/article>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"story\">\r\n <div class=\"container\">\r\n <div class=\"story\">\r\n <div class=\"story-copy\">\r\n <div class=\"section-label\">About Smart Elements<\/div>\r\n <h2>Precision. Passion. Periodic.<\/h2>\r\n <p>\r\n This concept positions the brand as premium, technical, and trustworthy.\r\n Instead of looking like a generic WooCommerce catalog, it frames the products as\r\n specialist materials with scientific credibility and collector appeal.\r\n <\/p>\r\n <div class=\"cta-row\">\r\n <a class=\"btn btn-primary\" href=\"#footer\">Contact us<\/a>\r\n <a class=\"btn btn-secondary\" href=\"#reviews\">See reviews<\/a>\r\n <\/div>\r\n <\/div>\r\n <div class=\"story-media\"><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n\r\n <section id=\"reviews\">\r\n <div class=\"container\">\r\n <div class=\"section-head\">\r\n <div>\r\n <div class=\"section-label\">Trusted by customers worldwide<\/div>\r\n <h2>Visible trust signals increase conversion<\/h2>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"review-grid\">\r\n <article class=\"card\">\r\n <div class=\"card-body\">\r\n <div class=\"stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n <h3 class=\"card-title\">Outstanding quality<\/h3>\r\n <div class=\"card-copy\">The products arrived perfectly packaged and matched the listed purity and presentation.<\/div>\r\n <div class=\"review-meta\">Dr. Michael L. \u00b7 Research Institute \u00b7 Germany<\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article class=\"card\">\r\n <div class=\"card-body\">\r\n <div class=\"stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n <h3 class=\"card-title\">Collector-grade finish<\/h3>\r\n <div class=\"card-copy\">The cube presentation feels premium and the whole experience looks far more high-end.<\/div>\r\n <div class=\"review-meta\">James C. \u00b7 Collector \u00b7 USA<\/div>\r\n <\/div>\r\n <\/article>\r\n\r\n <article class=\"card\">\r\n <div class=\"card-body\">\r\n <div class=\"stars\">\u2605\u2605\u2605\u2605\u2605<\/div>\r\n <h3 class=\"card-title\">Fast international shipping<\/h3>\r\n <div class=\"card-copy\">Strong communication, technical confidence, and a design that supports the credibility of the brand.<\/div>\r\n <div class=\"review-meta\">Prof. Sarah K. \u00b7 University \u00b7 Canada<\/div>\r\n <\/div>\r\n <\/article>\r\n <\/div>\r\n <\/div>\r\n <\/section>\r\n <\/main>\r\n\r\n <footer id=\"footer\">\r\n <div class=\"container\">\r\n <div class=\"footer-box\">\r\n <div>\r\n <div class=\"brand\" style=\"margin-bottom: 12px;\">\r\n <div class=\"logo\">S<\/div>\r\n <div class=\"brand-title\">SMART<br><span>ELEMENTS<\/span><\/div>\r\n <\/div>\r\n <p>High purity elements and premium scientific materials for research, industry and collectors.<\/p>\r\n <div class=\"muted-note\">Concept preview built as a single-file HTML mockup.<\/div>\r\n <\/div>\r\n\r\n <div>\r\n <h4>Shop<\/h4>\r\n <a href=\"#\">All Elements<\/a>\r\n <a href=\"#\">New Arrivals<\/a>\r\n <a href=\"#\">Collector Pieces<\/a>\r\n <a href=\"#\">Rare Earths<\/a>\r\n <\/div>\r\n\r\n <div>\r\n <h4>Customer Service<\/h4>\r\n <a href=\"#\">Shipping Information<\/a>\r\n <a href=\"#\">Payment Methods<\/a>\r\n <a href=\"#\">Returns & Refunds<\/a>\r\n <a href=\"#\">FAQ<\/a>\r\n <\/div>\r\n\r\n <div>\r\n <h4>Company<\/h4>\r\n <a href=\"#\">About Us<\/a>\r\n <a href=\"#\">Quality & Purity<\/a>\r\n <a href=\"#\">Custom Manufacturing<\/a>\r\n <a href=\"#\">Contact<\/a>\r\n <\/div>\r\n\r\n <div>\r\n <h4>Stay Updated<\/h4>\r\n <p>Subscribe for updates on new elements, rare materials and collector releases.<\/p>\r\n <form class=\"newsletter\" onsubmit=\"event.preventDefault(); alert('Demo only');\" action=\"\">\r\n <input type=\"email\" placeholder=\"Enter your email\" aria-label=\"Email address\" \/>\r\n <button type=\"submit\">\u2192<\/button>\r\n <input type=\"hidden\" name=\"trp-form-language\" value=\"de\"\/><\/form>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/footer>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\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>","protected":false},"excerpt":{"rendered":"<p>Smart Elements \u2013 Premium Homepage Mockup S SMART ELEMENTS Shop Featured About Reviews Contact Search elements, oxides, cubes\u2026 \u2630 \ud83d\udc64 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_acf_changed":false,"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-50630","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/smart-elements.com\/de\/wp-json\/wp\/v2\/pages\/50630","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/smart-elements.com\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/smart-elements.com\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/smart-elements.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/smart-elements.com\/de\/wp-json\/wp\/v2\/comments?post=50630"}],"version-history":[{"count":0,"href":"https:\/\/smart-elements.com\/de\/wp-json\/wp\/v2\/pages\/50630\/revisions"}],"wp:attachment":[{"href":"https:\/\/smart-elements.com\/de\/wp-json\/wp\/v2\/media?parent=50630"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}