{"id":136,"date":"2026-10-02T12:24:55","date_gmt":"2026-10-02T12:24:55","guid":{"rendered":"https:\/\/cdtmaker.club\/?page_id=136"},"modified":"2026-10-29T19:52:15","modified_gmt":"2026-10-29T19:52:15","slug":"project","status":"publish","type":"page","link":"https:\/\/cdtmaker.club\/?page_id=136","title":{"rendered":"project"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"136\" class=\"elementor elementor-136\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0986487 e-con-full e-flex e-con e-parent\" data-id=\"0986487\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6b416a3 elementor-widget elementor-widget-html\" data-id=\"6b416a3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- CDT MAKER CLUB | CREATION PROCESS -->\r\n<!-- Compact creative journey with real project photography and subtle motion -->\r\n\r\n<section class=\"mc-creation-process\" id=\"mc-creative-journey\">\r\n  <!-- Cinematic animated background: self-contained CSS, no MP4 URL needed -->\r\n  <div class=\"mc-cinema-background\" aria-hidden=\"true\">\r\n    <div class=\"mc-cinema-orb mc-cinema-orb-teal\"><\/div>\r\n    <div class=\"mc-cinema-orb mc-cinema-orb-orange\"><\/div>\r\n    <div class=\"mc-cinema-beam mc-cinema-beam-one\"><\/div>\r\n    <div class=\"mc-cinema-beam mc-cinema-beam-two\"><\/div>\r\n    <div class=\"mc-cinema-grain\"><\/div>\r\n  <\/div>\r\n\r\n\r\n  <div class=\"mc-background-glow\" aria-hidden=\"true\"><\/div>\r\n  <div class=\"mc-background-grid\" aria-hidden=\"true\"><\/div>\r\n\r\n  <div class=\"mc-process-inner\">\r\n\r\n    <!-- HERO -->\r\n    <header class=\"mc-hero\">\r\n\r\n      <div class=\"mc-hero-copy\">\r\n\r\n        <p class=\"mc-eyebrow mc-reveal\">\r\n          <span class=\"mc-live-dot\"><\/span>\r\n          FROM IDEA TO CREATION\r\n        <\/p>\r\n\r\n        <h2 class=\"mc-hero-title\">\r\n          <span class=\"mc-title-line\"><span>Think it.<\/span><\/span>\r\n          <span class=\"mc-title-line\"><span>Make it.<\/span><\/span>\r\n          <span class=\"mc-title-line mc-title-accent\"><span>Bring it to life.<\/span><\/span>\r\n        <\/h2>\r\n\r\n        <p class=\"mc-hero-description mc-reveal\">\r\n          Every creation starts with curiosity. Here's how ideas become real.\r\n        <\/p>\r\n\r\n        <a class=\"mc-discover-link\" href=\"#mc-journey-steps\">\r\n          <span>EXPLORE THE PROCESS<\/span>\r\n          <span class=\"mc-discover-arrow\" aria-hidden=\"true\">\u2193<\/span>\r\n        <\/a>\r\n\r\n      <\/div>\r\n\r\n      <div class=\"mc-hero-visual mc-reveal\">\r\n\r\n        <div class=\"mc-visual-backdrop\"><\/div>\r\n\r\n        <div class=\"mc-visual-image\">\r\n          <img decoding=\"async\"\r\n            src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.33.03-AM.webp\"\r\n            alt=\"People collaborating on a creative project\"\r\n            loading=\"lazy\"\r\n          >\r\n        <\/div>\r\n\r\n        <div class=\"mc-visual-frame\" aria-hidden=\"true\"><\/div>\r\n\r\n        <div class=\"mc-floating-label mc-label-top\">\r\n          <span class=\"mc-label-dot\"><\/span>\r\n          IDEAS IN MOTION\r\n        <\/div>\r\n\r\n        <div class=\"mc-floating-label mc-label-bottom\">\r\n          <span>CREATIVITY<\/span>\r\n          <span class=\"mc-label-separator\">\/<\/span>\r\n          <span>TECHNOLOGY<\/span>\r\n        <\/div>\r\n\r\n        <span class=\"mc-visual-index\" aria-hidden=\"true\">01<\/span>\r\n\r\n      <\/div>\r\n\r\n      <div class=\"mc-hero-side-note\" aria-hidden=\"true\">\r\n        MAKING IS A JOURNEY\r\n      <\/div>\r\n\r\n    <\/header>\r\n\r\n    <!-- SECTION INTRODUCTION -->\r\n    <div class=\"mc-journey-intro mc-reveal\" id=\"mc-journey-steps\">\r\n\r\n      <div class=\"mc-intro-left\">\r\n        <p class=\"mc-section-label\">THE CREATIVE JOURNEY<\/p>\r\n        <h3>From first thought<br>to final creation<span>.<\/span><\/h3>\r\n      <\/div>\r\n\r\n      <p class=\"mc-intro-right\">\r\n        Ideas aren't built in a single moment. They grow through curiosity,\r\n        experimentation, making and sharing.\r\n      <\/p>\r\n\r\n    <\/div>\r\n\r\n    <!-- STORYTELLING JOURNEY -->\r\n    <div class=\"mc-journey\">\r\n\r\n      <div class=\"mc-journey-rail\" aria-hidden=\"true\">\r\n        <span class=\"mc-rail-track\"><\/span>\r\n        <span class=\"mc-rail-progress\"><\/span>\r\n      <\/div>\r\n\r\n      <!-- STAGE 01 -->\r\n      <article class=\"mc-stage mc-stage-one mc-reveal\">\r\n\r\n        <div class=\"mc-stage-meta\">\r\n          <span class=\"mc-stage-number\">01<\/span>\r\n          <span class=\"mc-stage-category\">THE SPARK<\/span>\r\n        <\/div>\r\n\r\n        <div class=\"mc-stage-main\">\r\n\r\n          <div class=\"mc-stage-copy\">\r\n            <span class=\"mc-stage-overline\">EVERYTHING STARTS SOMEWHERE<\/span>\r\n            <h4>Imagine<span>.<\/span><\/h4>\r\n            <p>\r\n              Start with a question, a challenge or an idea worth exploring.\r\n              Give curiosity room to grow.\r\n            <\/p>\r\n            <div class=\"mc-stage-tag\">\r\n              <span>01<\/span> THINK DIFFERENTLY\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"mc-stage-art mc-art-imagine mc-reveal\">\r\n            <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.47.41-AM.webp\" alt=\"A notebook filled with early ideas and sketches\" loading=\"lazy\">\r\n            <span class=\"mc-photo-caption\" aria-hidden=\"true\">IDEA \/ 01<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <div class=\"mc-stage-bottom\">\r\n          <span>CURIOSITY IS THE STARTING POINT<\/span>\r\n          <span class=\"mc-stage-bottom-line\"><\/span>\r\n        <\/div>\r\n\r\n      <\/article>\r\n\r\n      <!-- STAGE 02 -->\r\n      <article class=\"mc-stage mc-stage-two mc-reveal\">\r\n\r\n        <div class=\"mc-stage-meta\">\r\n          <span class=\"mc-stage-number\">02<\/span>\r\n          <span class=\"mc-stage-category\">THE DISCOVERY<\/span>\r\n        <\/div>\r\n\r\n        <div class=\"mc-stage-main\">\r\n\r\n          <div class=\"mc-stage-copy\">\r\n            <span class=\"mc-stage-overline\">LEARN BY EXPLORING<\/span>\r\n            <h4>Experiment<span>.<\/span><\/h4>\r\n            <p>\r\n              Explore materials, tools and technologies to test your ideas.\r\n              Try new approaches and discover what works.\r\n            <\/p>\r\n            <div class=\"mc-stage-tag\">\r\n              <span>02<\/span> TEST THE POSSIBILITIES\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"mc-stage-art mc-art-experiment mc-reveal\">\r\n            <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.58.48-AM.webp\" alt=\"Electronics and circuit board being explored\" loading=\"lazy\">\r\n            <span class=\"mc-photo-caption\" aria-hidden=\"true\">EXPLORE \/ 02<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <div class=\"mc-stage-bottom\">\r\n          <span>DISCOVERY COMES THROUGH EXPERIMENTATION<\/span>\r\n          <span class=\"mc-stage-bottom-line\"><\/span>\r\n        <\/div>\r\n\r\n      <\/article>\r\n\r\n      <!-- STAGE 03 -->\r\n      <article class=\"mc-stage mc-stage-three mc-reveal\">\r\n\r\n        <div class=\"mc-stage-meta\">\r\n          <span class=\"mc-stage-number\">03<\/span>\r\n          <span class=\"mc-stage-category\">THE BUILD<\/span>\r\n        <\/div>\r\n\r\n        <div class=\"mc-stage-main\">\r\n\r\n          <div class=\"mc-stage-copy\">\r\n            <span class=\"mc-stage-overline\">TURN THOUGHT INTO SOMETHING REAL<\/span>\r\n            <h4>Create<span>.<\/span><\/h4>\r\n            <p>\r\n              Build, test and improve until your idea becomes a creation.\r\n              Make mistakes, learn and refine your work.\r\n            <\/p>\r\n            <div class=\"mc-stage-tag\">\r\n              <span>03<\/span> MAKE IT REAL\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"mc-stage-art mc-art-create mc-reveal\">\r\n            <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.31.44-AM.webp\" alt=\"A 3D printer creating a physical object\" loading=\"lazy\">\r\n            <span class=\"mc-photo-caption\" aria-hidden=\"true\">BUILD \/ 03<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <div class=\"mc-stage-bottom\">\r\n          <span>PROGRESS HAPPENS BY MAKING<\/span>\r\n          <span class=\"mc-stage-bottom-line\"><\/span>\r\n        <\/div>\r\n\r\n      <\/article>\r\n\r\n      <!-- STAGE 04 -->\r\n      <article class=\"mc-stage mc-stage-four mc-reveal\">\r\n\r\n        <div class=\"mc-stage-meta\">\r\n          <span class=\"mc-stage-number\">04<\/span>\r\n          <span class=\"mc-stage-category\">THE CONNECTION<\/span>\r\n        <\/div>\r\n\r\n        <div class=\"mc-stage-main\">\r\n\r\n          <div class=\"mc-stage-copy\">\r\n            <span class=\"mc-stage-overline\">GREAT IDEAS GROW TOGETHER<\/span>\r\n            <h4>Share<span>.<\/span><\/h4>\r\n            <p>\r\n              Show your work, exchange feedback and inspire the community.\r\n              Your creation could spark somebody else's next idea.\r\n            <\/p>\r\n            <div class=\"mc-stage-tag\">\r\n              <span>04<\/span> INSPIRE OTHERS\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"mc-stage-art mc-art-share mc-reveal\">\r\n            <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.33.00-AM.webp\" alt=\"A team sharing ideas and working together\" loading=\"lazy\">\r\n            <span class=\"mc-photo-caption\" aria-hidden=\"true\">SHARE \/ 04<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <div class=\"mc-stage-bottom\">\r\n          <span>SHARE KNOWLEDGE. INSPIRE CREATIVITY.<\/span>\r\n          <span class=\"mc-stage-bottom-line\"><\/span>\r\n        <\/div>\r\n\r\n      <\/article>\r\n\r\n    <\/div>\r\n\r\n    <!-- CLOSING -->\r\n    <footer class=\"mc-process-outro mc-reveal\">\r\n      <span class=\"mc-outro-symbol\" aria-hidden=\"true\">\u2733<\/span>\r\n      <p>Curiosity starts it. <span>Creativity brings it to life.<\/span><\/p>\r\n      <span class=\"mc-outro-decoration\" aria-hidden=\"true\"><\/span>\r\n    <\/footer>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;600;700&display=swap');\r\n\r\n\/* =========================================\r\n   BASE & ORIGINAL COLOUR PALETTE\r\n   ========================================= *\/\r\n\r\n.mc-creation-process {\r\n  --mc-primary: #19D8C4;\r\n  --mc-orange: #F0A04C;\r\n  --mc-background: #070A0B;\r\n  --mc-card: #15191D;\r\n  --mc-border: #343B40;\r\n  --mc-text: #F5F3F5;\r\n  --mc-secondary: #AEB8BD;\r\n\r\n  position: relative;\r\n  isolation: isolate;\r\n  display: block;\r\n  width: 100%;\r\n  max-width: 100%;\r\n  margin: 0 !important;\r\n  padding: 65px 6.5% 35px;\r\n  overflow: clip;\r\n  background: var(--mc-background) !important;\r\n  color: var(--mc-text);\r\n  font-family: 'Inter', Arial, sans-serif;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.mc-creation-process *,\r\n.mc-creation-process *::before,\r\n.mc-creation-process *::after {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.mc-creation-process h2,\r\n.mc-creation-process h3,\r\n.mc-creation-process h4,\r\n.mc-creation-process p {\r\n  text-transform: none;\r\n}\r\n\r\n.mc-creation-process .mc-process-inner {\r\n  position: relative;\r\n  z-index: 2;\r\n  max-width: 1440px;\r\n  width: 100%;\r\n  margin: 0 auto;\r\n}\r\n\r\n\/* CINEMATIC VIDEO-STYLE MOTION BACKGROUND \u2014 no external video required *\/\r\n.mc-creation-process {\r\n  position: relative;\r\n  isolation: isolate;\r\n  overflow: hidden;\r\n  background: #070A0B !important;\r\n}\r\n.mc-creation-process .mc-cinema-background {\r\n  position: absolute;\r\n  z-index: 0;\r\n  inset: 0;\r\n  overflow: hidden;\r\n  pointer-events: none;\r\n  background:\r\n    radial-gradient(ellipse at 50% 0%, rgba(25,216,196,.075), transparent 48%),\r\n    linear-gradient(135deg, #070A0B 0%, #091213 48%, #070A0B 100%);\r\n  background-size: 140% 140%;\r\n  animation: mc-cinema-base-shift 22s ease-in-out infinite alternate;\r\n}\r\n.mc-creation-process .mc-cinema-orb {\r\n  position: absolute;\r\n  width: clamp(260px, 42vw, 650px);\r\n  aspect-ratio: 1;\r\n  border-radius: 50%;\r\n  filter: blur(clamp(70px, 10vw, 145px));\r\n  will-change: transform, opacity;\r\n  mix-blend-mode: screen;\r\n}\r\n.mc-creation-process .mc-cinema-orb-teal {\r\n  top: -14%; left: -18%;\r\n  background: radial-gradient(circle, rgba(25,216,196,.26), rgba(25,216,196,.09) 38%, transparent 70%);\r\n  opacity: .72;\r\n  animation: mc-cinema-teal-drift 19s ease-in-out infinite alternate;\r\n}\r\n.mc-creation-process .mc-cinema-orb-orange {\r\n  top: 35%; right: -22%;\r\n  width: clamp(240px, 35vw, 520px);\r\n  background: radial-gradient(circle, rgba(240,160,76,.17), rgba(240,160,76,.055) 40%, transparent 72%);\r\n  opacity: .6;\r\n  animation: mc-cinema-orange-drift 24s ease-in-out infinite alternate;\r\n}\r\n.mc-creation-process .mc-cinema-beam {\r\n  position: absolute; top: -35%; width: 18%; height: 175%;\r\n  opacity: .11; filter: blur(42px); transform: rotate(24deg);\r\n  background: linear-gradient(180deg, transparent, rgba(25,216,196,.36), transparent);\r\n  will-change: transform;\r\n}\r\n.mc-creation-process .mc-cinema-beam-one {\r\n  left: 20%;\r\n  animation: mc-cinema-beam-sweep-one 28s ease-in-out infinite alternate;\r\n}\r\n.mc-creation-process .mc-cinema-beam-two {\r\n  right: 18%; opacity: .07;\r\n  background: linear-gradient(180deg, transparent, rgba(240,160,76,.34), transparent);\r\n  animation: mc-cinema-beam-sweep-two 32s ease-in-out infinite alternate;\r\n}\r\n.mc-creation-process .mc-cinema-grain {\r\n  position: absolute; inset: 0; opacity: .035;\r\n  background-image: radial-gradient(rgba(245,243,245,.8) .55px, transparent .7px);\r\n  background-size: 5px 5px;\r\n}\r\n.mc-creation-process .mc-process-inner { z-index: 1; }\r\n@keyframes mc-cinema-base-shift {\r\n  from { background-position: 0% 0%; }\r\n  to { background-position: 100% 100%; }\r\n}\r\n@keyframes mc-cinema-teal-drift {\r\n  0% { transform: translate3d(0,0,0) scale(.88); }\r\n  50% { transform: translate3d(15vw,13vh,0) scale(1.12); }\r\n  100% { transform: translate3d(7vw,24vh,0) scale(.98); }\r\n}\r\n@keyframes mc-cinema-orange-drift {\r\n  0% { transform: translate3d(0,0,0) scale(1); }\r\n  50% { transform: translate3d(-13vw,-10vh,0) scale(.86); }\r\n  100% { transform: translate3d(-5vw,9vh,0) scale(1.08); }\r\n}\r\n@keyframes mc-cinema-beam-sweep-one {\r\n  from { transform: translateX(-12vw) rotate(24deg); }\r\n  to { transform: translateX(20vw) rotate(24deg); }\r\n}\r\n@keyframes mc-cinema-beam-sweep-two {\r\n  from { transform: translateX(10vw) rotate(24deg); }\r\n  to { transform: translateX(-18vw) rotate(24deg); }\r\n}\r\n@media (prefers-reduced-motion: reduce) {\r\n  .mc-creation-process .mc-cinema-background,\r\n  .mc-creation-process .mc-cinema-orb,\r\n  .mc-creation-process .mc-cinema-beam { animation: none !important; }\r\n}\r\n\r\n\/* =========================================\r\n   AMBIENT BACKGROUND\r\n   ========================================= *\/\r\n\r\n.mc-creation-process .mc-background-glow {\r\n  position: absolute;\r\n  z-index: -1;\r\n  top: -220px;\r\n  left: -190px;\r\n  width: 480px;\r\n  height: 480px;\r\n  border-radius: 50%;\r\n  background: var(--mc-primary);\r\n  opacity: .055;\r\n  filter: blur(120px);\r\n  pointer-events: none;\r\n  animation: mc-glow-drift 18s ease-in-out infinite alternate;\r\n}\r\n\r\n.mc-creation-process .mc-background-grid {\r\n  position: absolute;\r\n  z-index: -1;\r\n  inset: 0;\r\n  opacity: .12;\r\n  pointer-events: none;\r\n  background-image: radial-gradient(#687A7C .65px, transparent .65px);\r\n  background-size: 30px 30px;\r\n  mask-image: linear-gradient(to bottom, black, transparent 65%);\r\n  -webkit-mask-image: linear-gradient(to bottom, black, transparent 65%);\r\n}\r\n\r\n\/* =========================================\r\n   HERO\r\n   ========================================= *\/\r\n\r\n.mc-creation-process .mc-hero {\r\n  position: relative;\r\n  display: grid;\r\n  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);\r\n  align-items: center;\r\n  gap: clamp(35px, 7vw, 105px);\r\n  min-height: 420px;\r\n  margin-bottom: 100px;\r\n}\r\n\r\n.mc-creation-process .mc-hero-copy {\r\n  position: relative;\r\n  z-index: 2;\r\n  min-width: 0;\r\n}\r\n\r\n.mc-creation-process .mc-eyebrow {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  color: var(--mc-primary);\r\n  font-size: 11px;\r\n  font-weight: 800;\r\n  letter-spacing: 2.5px;\r\n  line-height: 1.5;\r\n  margin: 0 0 26px;\r\n}\r\n\r\n.mc-creation-process .mc-live-dot {\r\n  width: 7px;\r\n  height: 7px;\r\n  flex: 0 0 auto;\r\n  border-radius: 50%;\r\n  background: var(--mc-primary);\r\n  box-shadow: 0 0 0 4px rgba(25,216,196,.08);\r\n  animation: mc-dot-pulse 2s ease-in-out infinite;\r\n}\r\n\r\n.mc-creation-process .mc-hero-title {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  color: var(--mc-text);\r\n  font-family: 'Space Grotesk', Arial, sans-serif;\r\n  font-size: clamp(43px, 5.4vw, 76px);\r\n  font-weight: 700;\r\n  line-height: 1.04;\r\n  letter-spacing: -3px;\r\n  margin: 0 0 26px;\r\n  padding: 0;\r\n}\r\n\r\n.mc-creation-process .mc-title-line {\r\n  display: block;\r\n  overflow: hidden;\r\n  padding: 0 0 .07em;\r\n  margin: 0;\r\n}\r\n\r\n.mc-creation-process .mc-title-line > span {\r\n  display: inline-block;\r\n  animation: mc-title-enter .85s cubic-bezier(.16,1,.3,1) both;\r\n}\r\n\r\n.mc-creation-process .mc-title-line:nth-child(2) > span {\r\n  animation-delay: .12s;\r\n}\r\n\r\n.mc-creation-process .mc-title-line:nth-child(3) > span {\r\n  animation-delay: .24s;\r\n}\r\n\r\n.mc-creation-process .mc-title-accent {\r\n  color: var(--mc-primary);\r\n}\r\n\r\n.mc-creation-process .mc-hero-description {\r\n  max-width: 420px;\r\n  color: var(--mc-secondary);\r\n  font-size: 15px;\r\n  line-height: 1.9;\r\n  margin: 0;\r\n}\r\n\r\n.mc-creation-process .mc-discover-link {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 18px;\r\n  margin-top: 31px;\r\n  padding: 0 0 10px;\r\n  border: 0;\r\n  border-bottom: 1px solid var(--mc-border);\r\n  border-radius: 0;\r\n  background: transparent;\r\n  color: var(--mc-text);\r\n  font-family: 'Inter', Arial, sans-serif;\r\n  font-size: 9px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.6px;\r\n  text-decoration: none;\r\n  transition: color .3s ease, border-color .3s ease;\r\n}\r\n\r\n.mc-creation-process .mc-discover-link:hover {\r\n  color: var(--mc-primary);\r\n  border-color: var(--mc-primary);\r\n}\r\n\r\n.mc-creation-process .mc-discover-arrow {\r\n  display: inline-block;\r\n  color: var(--mc-primary);\r\n  font-size: 18px;\r\n  font-weight: 400;\r\n  transition: transform .3s ease;\r\n}\r\n\r\n.mc-creation-process .mc-discover-link:hover .mc-discover-arrow {\r\n  transform: translateY(4px);\r\n}\r\n\r\n\/* =========================================\r\n   CINEMATIC IMAGE\r\n   ========================================= *\/\r\n\r\n.mc-creation-process .mc-hero-visual {\r\n  position: relative;\r\n  width: 100%;\r\n  max-width: 430px;\r\n  justify-self: end;\r\n  margin: 0;\r\n  perspective: 900px;\r\n}\r\n\r\n.mc-creation-process .mc-visual-backdrop {\r\n  position: absolute;\r\n  top: 12%;\r\n  right: -10%;\r\n  width: 75%;\r\n  height: 80%;\r\n  border: 1px solid rgba(25,216,196,.35);\r\n  transform: rotate(5deg);\r\n  transition: transform .7s cubic-bezier(.2,.7,.2,1);\r\n}\r\n\r\n.mc-creation-process .mc-visual-image {\r\n  position: relative;\r\n  z-index: 1;\r\n  width: 100%;\r\n  aspect-ratio: 4 \/ 4.65;\r\n  overflow: hidden;\r\n  background: var(--mc-card);\r\n  transform: translateZ(0);\r\n}\r\n\r\n.mc-creation-process .mc-visual-image img {\r\n  display: block;\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  object-position: center;\r\n  border: 0;\r\n  border-radius: 0;\r\n  margin: 0;\r\n  padding: 0;\r\n  transform: scale(1.08);\r\n  animation: mc-image-reveal 1.4s cubic-bezier(.2,.7,.2,1) both;\r\n  transition: transform 1.2s cubic-bezier(.2,.7,.2,1),\r\n              filter .7s ease;\r\n}\r\n\r\n.mc-creation-process .mc-hero-visual:hover .mc-visual-image img {\r\n  transform: scale(1.15);\r\n  filter: saturate(1.08);\r\n}\r\n\r\n.mc-creation-process .mc-hero-visual:hover .mc-visual-backdrop {\r\n  transform: rotate(2deg) translate(5px, -5px);\r\n}\r\n\r\n.mc-creation-process .mc-visual-frame {\r\n  position: absolute;\r\n  z-index: 2;\r\n  inset: 0;\r\n  border: 1px solid rgba(25,216,196,.22);\r\n  pointer-events: none;\r\n}\r\n\r\n.mc-creation-process .mc-visual-frame::before,\r\n.mc-creation-process .mc-visual-frame::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  width: 28px;\r\n  height: 28px;\r\n  transition: width .4s ease, height .4s ease;\r\n}\r\n\r\n.mc-creation-process .mc-visual-frame::before {\r\n  top: 13px;\r\n  left: 13px;\r\n  border-top: 1px solid var(--mc-primary);\r\n  border-left: 1px solid var(--mc-primary);\r\n}\r\n\r\n.mc-creation-process .mc-visual-frame::after {\r\n  right: 13px;\r\n  bottom: 13px;\r\n  border-right: 1px solid var(--mc-primary);\r\n  border-bottom: 1px solid var(--mc-primary);\r\n}\r\n\r\n.mc-creation-process .mc-hero-visual:hover .mc-visual-frame::before,\r\n.mc-creation-process .mc-hero-visual:hover .mc-visual-frame::after {\r\n  width: 40px;\r\n  height: 40px;\r\n}\r\n\r\n.mc-creation-process .mc-visual-image::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 35% 0 0;\r\n  background: linear-gradient(180deg, transparent, rgba(7,10,11,.68));\r\n  pointer-events: none;\r\n}\r\n\r\n.mc-creation-process .mc-floating-label {\r\n  position: absolute;\r\n  z-index: 3;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 9px;\r\n  color: var(--mc-text);\r\n  font-size: 8px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.5px;\r\n}\r\n\r\n.mc-creation-process .mc-label-top {\r\n  top: 25px;\r\n  left: -22px;\r\n  padding: 12px 15px;\r\n  border: 1px solid var(--mc-border);\r\n  background: var(--mc-card);\r\n  animation: mc-label-float 5s ease-in-out infinite;\r\n}\r\n\r\n.mc-creation-process .mc-label-dot {\r\n  width: 6px;\r\n  height: 6px;\r\n  border-radius: 50%;\r\n  background: var(--mc-primary);\r\n}\r\n\r\n.mc-creation-process .mc-label-bottom {\r\n  left: 23px;\r\n  bottom: 23px;\r\n  gap: 8px;\r\n}\r\n\r\n.mc-creation-process .mc-label-separator {\r\n  color: var(--mc-primary);\r\n}\r\n\r\n.mc-creation-process .mc-visual-index {\r\n  position: absolute;\r\n  z-index: 3;\r\n  right: -26px;\r\n  bottom: 35%;\r\n  color: var(--mc-primary);\r\n  font-family: 'Space Grotesk', Arial, sans-serif;\r\n  font-size: 11px;\r\n  letter-spacing: 2px;\r\n}\r\n\r\n.mc-creation-process .mc-hero-side-note {\r\n  position: absolute;\r\n  top: 50%;\r\n  right: -45px;\r\n  color: var(--mc-secondary);\r\n  font-size: 8px;\r\n  font-weight: 700;\r\n  letter-spacing: 2px;\r\n  writing-mode: vertical-rl;\r\n  transform: translateY(-50%);\r\n}\r\n\r\n\/* =========================================\r\n   JOURNEY INTRODUCTION\r\n   ========================================= *\/\r\n\r\n.mc-creation-process .mc-journey-intro {\r\n  display: grid;\r\n  grid-template-columns: minmax(0, 1fr) minmax(230px, .55fr);\r\n  align-items: end;\r\n  gap: 55px;\r\n  margin: 0 0 35px;\r\n  padding: 0 0 29px;\r\n  border-bottom: 1px solid var(--mc-border);\r\n  scroll-margin-top: 110px;\r\n}\r\n\r\n.mc-creation-process .mc-section-label {\r\n  color: var(--mc-primary);\r\n  font-size: 9px;\r\n  font-weight: 800;\r\n  letter-spacing: 2px;\r\n  margin: 0 0 15px;\r\n}\r\n\r\n.mc-creation-process .mc-intro-left h3 {\r\n  color: var(--mc-text);\r\n  font-family: 'Space Grotesk', Arial, sans-serif;\r\n  font-size: clamp(27px, 3.2vw, 42px);\r\n  font-weight: 600;\r\n  line-height: 1.2;\r\n  letter-spacing: -1.3px;\r\n  margin: 0;\r\n}\r\n\r\n.mc-creation-process .mc-intro-left h3 span {\r\n  color: var(--mc-primary);\r\n}\r\n\r\n.mc-creation-process .mc-intro-right {\r\n  color: var(--mc-secondary);\r\n  font-size: 13px;\r\n  line-height: 1.9;\r\n  margin: 0 0 3px;\r\n}\r\n\r\n\/* =========================================\r\n   STORYTELLING STAGES\r\n   ========================================= *\/\r\n\r\n.mc-creation-process .mc-journey {\r\n  position: relative;\r\n}\r\n\r\n.mc-creation-process .mc-stage {\r\n  position: relative;\r\n  display: grid;\r\n  grid-template-columns: 100px minmax(0, 1fr);\r\n  gap: clamp(20px, 4vw, 60px);\r\n  margin: 0;\r\n  padding: 43px 0 32px;\r\n  border-bottom: 1px solid var(--mc-border);\r\n}\r\n\r\n.mc-creation-process .mc-stage-meta {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  gap: 13px;\r\n  padding-top: 4px;\r\n}\r\n\r\n.mc-creation-process .mc-stage-number {\r\n  color: var(--mc-primary);\r\n  font-family: 'Space Grotesk', Arial, sans-serif;\r\n  font-size: 13px;\r\n  font-weight: 700;\r\n  letter-spacing: 1px;\r\n}\r\n\r\n.mc-creation-process .mc-stage-category {\r\n  color: var(--mc-secondary);\r\n  font-size: 8px;\r\n  font-weight: 800;\r\n  letter-spacing: 1px;\r\n  line-height: 1.6;\r\n  writing-mode: vertical-rl;\r\n  transform: rotate(180deg);\r\n}\r\n\r\n.mc-creation-process .mc-stage-main {\r\n  display: grid;\r\n  grid-template-columns: minmax(0, .9fr) minmax(240px, 1.1fr);\r\n  align-items: center;\r\n  gap: clamp(30px, 7vw, 100px);\r\n}\r\n\r\n.mc-creation-process .mc-stage-copy {\r\n  min-width: 0;\r\n  padding: 5px 0;\r\n}\r\n\r\n.mc-creation-process .mc-stage-overline {\r\n  display: block;\r\n  color: var(--mc-secondary);\r\n  font-size: 8px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.6px;\r\n  line-height: 1.7;\r\n  margin: 0 0 17px;\r\n}\r\n\r\n.mc-creation-process .mc-stage-copy h4 {\r\n  color: var(--mc-text);\r\n  font-family: 'Space Grotesk', Arial, sans-serif;\r\n  font-size: clamp(35px, 4.2vw, 55px);\r\n  font-weight: 700;\r\n  line-height: 1.1;\r\n  letter-spacing: -1.8px;\r\n  margin: 0 0 17px;\r\n}\r\n\r\n.mc-creation-process .mc-stage-copy h4 span {\r\n  color: var(--mc-primary);\r\n}\r\n\r\n.mc-creation-process .mc-stage-copy > p {\r\n  max-width: 390px;\r\n  color: var(--mc-secondary);\r\n  font-size: 13px;\r\n  line-height: 1.9;\r\n  margin: 0;\r\n}\r\n\r\n.mc-creation-process .mc-stage-tag {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 11px;\r\n  margin-top: 25px;\r\n  padding: 9px 0;\r\n  color: var(--mc-text);\r\n  font-size: 8px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.2px;\r\n}\r\n\r\n.mc-creation-process .mc-stage-tag > span {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 24px;\r\n  height: 24px;\r\n  border: 1px solid var(--mc-border);\r\n  border-radius: 50%;\r\n  color: var(--mc-primary);\r\n  font-family: 'Space Grotesk', Arial, sans-serif;\r\n  font-size: 9px;\r\n}\r\n\r\n\/* =========================================\r\n   REAL PROJECT PHOTOGRAPHY \u2014 NO ABSTRACT LOGOS\r\n   ========================================= *\/\r\n\r\n.mc-creation-process .mc-stage-art {\r\n  position: relative;\r\n  display: block;\r\n  width: 100%;\r\n  max-width: 380px;\r\n  min-height: 0;\r\n  aspect-ratio: 1.55 \/ 1;\r\n  justify-self: end;\r\n  overflow: hidden;\r\n  background: var(--mc-card);\r\n  border: 1px solid rgba(25,216,196,.22);\r\n  isolation: isolate;\r\n}\r\n\r\n.mc-creation-process .mc-stage-art img {\r\n  display: block;\r\n  width: 100%;\r\n  height: 100%;\r\n  min-height: 190px;\r\n  object-fit: cover;\r\n  object-position: center;\r\n  opacity: .88;\r\n  filter: saturate(.82) contrast(1.04);\r\n  transform: scale(1.025);\r\n  transition: transform .9s cubic-bezier(.2,.7,.2,1), filter .6s ease, opacity .6s ease;\r\n}\r\n\r\n.mc-creation-process .mc-stage-art::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  z-index: 1;\r\n  inset: 0;\r\n  background: linear-gradient(180deg, rgba(7,10,11,.02) 35%, rgba(7,10,11,.72) 100%);\r\n  pointer-events: none;\r\n}\r\n\r\n.mc-creation-process .mc-stage:hover .mc-stage-art img {\r\n  transform: scale(1.09);\r\n  filter: saturate(1.08) contrast(1.04);\r\n  opacity: 1;\r\n}\r\n\r\n.mc-creation-process .mc-photo-caption {\r\n  position: absolute;\r\n  z-index: 2;\r\n  right: 14px;\r\n  bottom: 13px;\r\n  color: var(--mc-text);\r\n  font-size: 8px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.7px;\r\n  line-height: 1.4;\r\n  padding: 8px 10px;\r\n  border: 1px solid rgba(245,243,245,.32);\r\n  background: rgba(7,10,11,.58);\r\n  backdrop-filter: blur(8px);\r\n}\r\n\r\n.mc-creation-process .mc-stage-art::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  z-index: 2;\r\n  inset: 10px;\r\n  border: 1px solid rgba(245,243,245,.16);\r\n  pointer-events: none;\r\n  transition: inset .5s ease, border-color .5s ease;\r\n}\r\n\r\n.mc-creation-process .mc-stage:hover .mc-stage-art::before {\r\n  inset: 6px;\r\n  border-color: rgba(25,216,196,.6);\r\n}\r\n\r\n\/* =========================================\r\n   STAGE FOOTERS\r\n   ========================================= *\/\r\n\r\n.mc-creation-process .mc-stage-bottom {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 18px;\r\n  margin: 28px 0 0 100px;\r\n  color: var(--mc-secondary);\r\n  font-size: 8px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.4px;\r\n}\r\n\r\n.mc-creation-process .mc-stage-bottom-line {\r\n  display: inline-block;\r\n  width: 0;\r\n  height: 1px;\r\n  background: var(--mc-primary);\r\n  transition: width .65s cubic-bezier(.2,.7,.2,1);\r\n}\r\n\r\n.mc-creation-process .mc-stage:hover .mc-stage-bottom-line {\r\n  width: 65px;\r\n}\r\n\r\n\/* =========================================\r\n   CLOSING\r\n   ========================================= *\/\r\n\r\n.mc-creation-process .mc-process-outro {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 16px;\r\n  margin-top: 55px;\r\n  padding-top: 25px;\r\n  border-top: 1px solid var(--mc-border);\r\n}\r\n\r\n.mc-creation-process .mc-outro-symbol {\r\n  color: var(--mc-primary);\r\n  font-size: 25px;\r\n  animation: mc-ring-turn 22s linear infinite;\r\n}\r\n\r\n.mc-creation-process .mc-process-outro p {\r\n  color: var(--mc-secondary);\r\n  font-family: 'Space Grotesk', Arial, sans-serif;\r\n  font-size: clamp(13px, 1.5vw, 17px);\r\n  font-weight: 500;\r\n  line-height: 1.6;\r\n  margin: 0;\r\n}\r\n\r\n.mc-creation-process .mc-process-outro p span {\r\n  color: var(--mc-text);\r\n}\r\n\r\n.mc-creation-process .mc-outro-decoration {\r\n  width: 55px;\r\n  height: 1px;\r\n  margin-left: auto;\r\n  background: var(--mc-primary);\r\n  opacity: .7;\r\n}\r\n\r\n\/* =========================================\r\n   SCROLL REVEALS\r\n   ========================================= *\/\r\n\r\n\/* Without JS, all content remains visible. *\/\r\n\r\n.mc-creation-process.mc-motion-ready .mc-reveal {\r\n  opacity: 0;\r\n  transform: translateY(28px);\r\n  transition:\r\n    opacity .85s ease,\r\n    transform .9s cubic-bezier(.16,1,.3,1);\r\n  transition-delay: var(--mc-delay, 0ms);\r\n}\r\n\r\n.mc-creation-process.mc-motion-ready .mc-reveal.mc-in-view {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n.mc-creation-process.mc-motion-ready .mc-stage {\r\n  transition:\r\n    opacity .8s ease,\r\n    transform .9s cubic-bezier(.16,1,.3,1),\r\n    border-color .4s ease;\r\n}\r\n\r\n.mc-creation-process .mc-journey-rail {\r\n  position: absolute;\r\n  z-index: 0;\r\n  top: 0;\r\n  bottom: 0;\r\n  left: 49px;\r\n  width: 1px;\r\n  pointer-events: none;\r\n}\r\n\r\n.mc-creation-process .mc-rail-track,\r\n.mc-creation-process .mc-rail-progress {\r\n  position: absolute;\r\n  top: 0;\r\n  bottom: 0;\r\n  left: 0;\r\n  display: block;\r\n  width: 1px;\r\n}\r\n\r\n.mc-creation-process .mc-rail-track {\r\n  background: var(--mc-border);\r\n  opacity: .45;\r\n}\r\n\r\n.mc-creation-process .mc-rail-progress {\r\n  height: 0;\r\n  bottom: auto;\r\n  background: var(--mc-primary);\r\n  box-shadow: 0 0 8px rgba(25,216,196,.2);\r\n  transition: height .15s linear;\r\n}\r\n\r\n\/* =========================================\r\n   KEYFRAMES\r\n   ========================================= *\/\r\n\r\n@keyframes mc-title-enter {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(105%);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n}\r\n\r\n@keyframes mc-image-reveal {\r\n  from {\r\n    opacity: .4;\r\n    transform: scale(1.16);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: scale(1.08);\r\n  }\r\n}\r\n\r\n@keyframes mc-dot-pulse {\r\n  0%, 100% {\r\n    box-shadow: 0 0 0 4px rgba(25,216,196,.08);\r\n  }\r\n  50% {\r\n    box-shadow: 0 0 0 7px rgba(25,216,196,.02);\r\n  }\r\n}\r\n\r\n@keyframes mc-glow-drift {\r\n  from { transform: translate(0,0); }\r\n  to { transform: translate(70px,45px); }\r\n}\r\n\r\n@keyframes mc-label-float {\r\n  0%, 100% { transform: translateY(0); }\r\n  50% { transform: translateY(-5px); }\r\n}\r\n\r\n@keyframes mc-ring-turn {\r\n  from { rotate: 0deg; }\r\n  to { rotate: 360deg; }\r\n}\r\n\r\n@keyframes mc-cross-float {\r\n  0%, 100% { transform: translateY(0); opacity: .7; }\r\n  50% { transform: translateY(-9px); opacity: 1; }\r\n}\r\n\r\n@keyframes mc-grid-breathe {\r\n  0%, 100% { opacity: .45; transform: scale(.96); }\r\n  50% { opacity: .8; transform: scale(1.03); }\r\n}\r\n\r\n@keyframes mc-node-pulse {\r\n  0%, 100% { box-shadow: 0 0 0 0 rgba(25,216,196,0); }\r\n  50% { box-shadow: 0 0 0 5px rgba(25,216,196,.06); }\r\n}\r\n\r\n\/* =========================================\r\n   TABLET\r\n   ========================================= *\/\r\n\r\n@media (max-width: 1024px) {\r\n  .mc-creation-process {\r\n    padding: 50px 5% 30px;\r\n  }\r\n\r\n  .mc-creation-process .mc-hero {\r\n    grid-template-columns: minmax(0, 1fr) minmax(220px, .8fr);\r\n    gap: 35px;\r\n    min-height: 340px;\r\n    margin-bottom: 75px;\r\n  }\r\n\r\n  .mc-creation-process .mc-hero-title {\r\n    font-size: clamp(38px, 5.5vw, 57px);\r\n    letter-spacing: -1.8px;\r\n  }\r\n\r\n  .mc-creation-process .mc-hero-side-note {\r\n    display: none;\r\n  }\r\n\r\n  .mc-creation-process .mc-journey-intro {\r\n    gap: 30px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage {\r\n    grid-template-columns: 65px minmax(0, 1fr);\r\n    gap: 25px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-main {\r\n    grid-template-columns: minmax(0, 1fr) minmax(190px, .9fr);\r\n    gap: 25px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-copy h4 {\r\n    font-size: clamp(32px, 4vw, 43px);\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-art {\r\n    min-height: 215px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-bottom {\r\n    margin-left: 65px;\r\n  }\r\n\r\n  .mc-creation-process .mc-journey-rail {\r\n    left: 32px;\r\n  }\r\n}\r\n\r\n\/* =========================================\r\n   MOBILE\r\n   ========================================= *\/\r\n\r\n@media (max-width: 767px) {\r\n  .mc-creation-process {\r\n    padding: 36px 6% 25px;\r\n  }\r\n\r\n  .mc-creation-process .mc-hero {\r\n    grid-template-columns: minmax(0, 1fr);\r\n    gap: 34px;\r\n    min-height: 0;\r\n    margin-bottom: 60px;\r\n  }\r\n\r\n  .mc-creation-process .mc-eyebrow {\r\n    font-size: 10px;\r\n    letter-spacing: 2px;\r\n    margin-bottom: 22px;\r\n  }\r\n\r\n  .mc-creation-process .mc-hero-title {\r\n    font-size: clamp(39px, 10vw, 56px);\r\n    line-height: 1.08;\r\n    letter-spacing: -1.8px;\r\n    margin-bottom: 20px;\r\n  }\r\n\r\n  .mc-creation-process .mc-hero-description {\r\n    font-size: 14px;\r\n    line-height: 1.85;\r\n  }\r\n\r\n  .mc-creation-process .mc-discover-link {\r\n    margin-top: 24px;\r\n  }\r\n\r\n  .mc-creation-process .mc-hero-visual {\r\n    max-width: 100%;\r\n  }\r\n\r\n  .mc-creation-process .mc-visual-image {\r\n    aspect-ratio: 1.15 \/ 1;\r\n  }\r\n\r\n  .mc-creation-process .mc-label-top {\r\n    top: 15px;\r\n    left: -5px;\r\n    padding: 10px 12px;\r\n    font-size: 7px;\r\n  }\r\n\r\n  .mc-creation-process .mc-label-bottom {\r\n    left: 17px;\r\n    bottom: 17px;\r\n    font-size: 7px;\r\n  }\r\n\r\n  .mc-creation-process .mc-visual-index {\r\n    right: -1px;\r\n    bottom: auto;\r\n    top: 17px;\r\n  }\r\n\r\n  .mc-creation-process .mc-journey-intro {\r\n    grid-template-columns: minmax(0, 1fr);\r\n    gap: 17px;\r\n    margin-bottom: 20px;\r\n    padding-bottom: 21px;\r\n  }\r\n\r\n  .mc-creation-process .mc-intro-left h3 {\r\n    font-size: 29px;\r\n    letter-spacing: -.8px;\r\n  }\r\n\r\n  .mc-creation-process .mc-intro-right {\r\n    max-width: 390px;\r\n    font-size: 12px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage {\r\n    grid-template-columns: 35px minmax(0, 1fr);\r\n    gap: 14px;\r\n    padding: 30px 0 24px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-meta {\r\n    gap: 11px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-number {\r\n    font-size: 11px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-category {\r\n    font-size: 7px;\r\n    letter-spacing: .7px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-main {\r\n    grid-template-columns: minmax(0, 1fr);\r\n    gap: 18px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-overline {\r\n    font-size: 7px;\r\n    letter-spacing: 1.2px;\r\n    margin-bottom: 12px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-copy h4 {\r\n    font-size: clamp(35px, 9vw, 44px);\r\n    letter-spacing: -1px;\r\n    margin-bottom: 12px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-copy > p {\r\n    font-size: 12px;\r\n    line-height: 1.85;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-tag {\r\n    margin-top: 16px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-art {\r\n    max-width: 100%;\r\n    min-height: 190px;\r\n  }\r\n\r\n  .mc-creation-process .mc-ring-three {\r\n    width: 175px;\r\n    height: 175px;\r\n  }\r\n\r\n  .mc-creation-process .mc-ring-two {\r\n    width: 135px;\r\n    height: 135px;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-bottom {\r\n    gap: 12px;\r\n    margin: 20px 0 0 49px;\r\n    font-size: 7px;\r\n    letter-spacing: .9px;\r\n    line-height: 1.7;\r\n  }\r\n\r\n  .mc-creation-process .mc-stage-bottom-line {\r\n    display: none;\r\n  }\r\n\r\n  .mc-creation-process .mc-journey-rail {\r\n    left: 17px;\r\n  }\r\n\r\n  .mc-creation-process .mc-process-outro {\r\n    gap: 12px;\r\n    margin-top: 37px;\r\n    padding-top: 20px;\r\n  }\r\n\r\n  .mc-creation-process .mc-outro-symbol {\r\n    font-size: 20px;\r\n  }\r\n\r\n  .mc-creation-process .mc-process-outro p {\r\n    font-size: 12px;\r\n  }\r\n\r\n  .mc-creation-process .mc-outro-decoration {\r\n    width: 22px;\r\n  }\r\n}\r\n\r\n\/* =========================================\r\n   REDUCED MOTION\r\n   ========================================= *\/\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  .mc-creation-process *,\r\n  .mc-creation-process *::before,\r\n  .mc-creation-process *::after {\r\n    animation: none !important;\r\n    transition-duration: .01ms !important;\r\n    scroll-behavior: auto !important;\r\n  }\r\n\r\n  .mc-creation-process.mc-motion-ready .mc-reveal {\r\n    opacity: 1;\r\n    transform: none;\r\n  }\r\n}\r\n\r\n\/* COMPACT SPACING PATCH \u2014 reduce unused vertical and horizontal space *\/\r\n.mc-creation-process {\r\n  padding-top: 42px !important;\r\n  padding-bottom: 24px !important;\r\n}\r\n.mc-creation-process .mc-hero {\r\n  min-height: 0 !important;\r\n  gap: clamp(24px, 4vw, 58px) !important;\r\n  margin-bottom: 54px !important;\r\n}\r\n.mc-creation-process .mc-hero-title { margin-bottom: 18px !important; }\r\n.mc-creation-process .mc-eyebrow { margin-bottom: 18px !important; }\r\n.mc-creation-process .mc-journey-intro {\r\n  gap: 32px !important;\r\n  margin-bottom: 18px !important;\r\n  padding-bottom: 20px !important;\r\n}\r\n.mc-creation-process .mc-stage {\r\n  padding-top: 26px !important;\r\n  padding-bottom: 22px !important;\r\n  gap: clamp(18px, 3vw, 42px) !important;\r\n}\r\n.mc-creation-process .mc-stage-main {\r\n  gap: clamp(22px, 4vw, 58px) !important;\r\n}\r\n.mc-creation-process .mc-stage-art {\r\n  min-height: 0 !important;\r\n  max-width: 380px !important;\r\n  aspect-ratio: 1.55 \/ 1;\r\n}\r\n.mc-creation-process .mc-stage-art img { min-height: 0; }\r\n.mc-creation-process .mc-stage-bottom {\r\n  margin-top: 17px !important;\r\n}\r\n.mc-creation-process .mc-process-outro {\r\n  margin-top: 30px !important;\r\n  padding-top: 18px !important;\r\n}\r\n@media (max-width: 1024px) {\r\n  .mc-creation-process { padding-top: 36px !important; }\r\n  .mc-creation-process .mc-hero { margin-bottom: 42px !important; }\r\n  .mc-creation-process .mc-stage { padding-top: 23px !important; padding-bottom: 20px !important; }\r\n  .mc-creation-process .mc-stage-art { min-height: 0 !important; aspect-ratio: 1.5 \/ 1; }\r\n}\r\n@media (max-width: 767px) {\r\n  .mc-creation-process { padding-top: 26px !important; padding-bottom: 18px !important; }\r\n  .mc-creation-process .mc-hero { gap: 22px !important; margin-bottom: 38px !important; }\r\n  .mc-creation-process .mc-journey-intro { gap: 12px !important; margin-bottom: 12px !important; padding-bottom: 16px !important; }\r\n  .mc-creation-process .mc-stage { padding-top: 22px !important; padding-bottom: 18px !important; }\r\n  .mc-creation-process .mc-stage-main { gap: 12px !important; }\r\n  .mc-creation-process .mc-stage-art { min-height: 0 !important; aspect-ratio: 1.4 \/ 1; }\r\n  .mc-creation-process .mc-stage-art img { min-height: 0; }\r\n  .mc-creation-process .mc-stage-bottom { margin-top: 13px !important; }\r\n  .mc-creation-process .mc-process-outro { margin-top: 24px !important; padding-top: 16px !important; }\r\n}\r\n\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  function initMCJourney() {\r\n    document.querySelectorAll('.mc-creation-process').forEach(function (section) {\r\n      if (section.dataset.mcJourneyInit === 'true') return;\r\n      section.dataset.mcJourneyInit = 'true';\r\n\r\n      var reducedMotion = window.matchMedia(\r\n        '(prefers-reduced-motion: reduce)'\r\n      ).matches;\r\n\r\n      var reveals = section.querySelectorAll('.mc-reveal');\r\n      var progress = section.querySelector('.mc-rail-progress');\r\n      var journey = section.querySelector('.mc-journey');\r\n\r\n      if (reducedMotion || !('IntersectionObserver' in window)) {\r\n        reveals.forEach(function (element) {\r\n          element.classList.add('mc-in-view');\r\n        });\r\n        if (progress) progress.style.height = '100%';\r\n        return;\r\n      }\r\n\r\n      section.classList.add('mc-motion-ready');\r\n\r\n      var revealObserver = new IntersectionObserver(function (entries) {\r\n        entries.forEach(function (entry) {\r\n          if (!entry.isIntersecting) return;\r\n          entry.target.classList.add('mc-in-view');\r\n          revealObserver.unobserve(entry.target);\r\n        });\r\n      }, {\r\n        threshold: 0.12,\r\n        rootMargin: '0px 0px -30px 0px'\r\n      });\r\n\r\n      reveals.forEach(function (element) {\r\n        revealObserver.observe(element);\r\n      });\r\n\r\n      \/* Progress line follows scrolling through the four stages. *\/\r\n      if (progress && journey) {\r\n        var ticking = false;\r\n\r\n        function updateProgress() {\r\n          var rect = journey.getBoundingClientRect();\r\n          var viewportHeight = window.innerHeight;\r\n          var journeyHeight = journey.offsetHeight;\r\n          var distance = viewportHeight * 0.65;\r\n          var scrolled = distance - rect.top;\r\n          var percentage = Math.max(\r\n            0,\r\n            Math.min(100, (scrolled \/ (journeyHeight + distance - viewportHeight * 0.25)) * 100)\r\n          );\r\n\r\n          progress.style.height = percentage + '%';\r\n          ticking = false;\r\n        }\r\n\r\n        function requestProgressUpdate() {\r\n          if (ticking) return;\r\n          ticking = true;\r\n          window.requestAnimationFrame(updateProgress);\r\n        }\r\n\r\n        window.addEventListener('scroll', requestProgressUpdate, { passive: true });\r\n        window.addEventListener('resize', requestProgressUpdate);\r\n        updateProgress();\r\n      }\r\n    });\r\n  }\r\n\r\n  if (document.readyState === 'loading') {\r\n    document.addEventListener('DOMContentLoaded', initMCJourney);\r\n  } else {\r\n    initMCJourney();\r\n  }\r\n\r\n  window.addEventListener('elementor\/frontend\/init', initMCJourney);\r\n  setTimeout(initMCJourney, 800);\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1de77db e-con-full e-flex e-con e-parent\" data-id=\"1de77db\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-aa4b048 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"aa4b048\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"mc-featured-projects\">\r\n  <!-- Premium computer-science inspired animated background -->\r\n  <div class=\"mc-pro-tech-background\" aria-hidden=\"true\">\r\n    <div class=\"mc-pro-tech-grid\"><\/div>\r\n    <div class=\"mc-pro-tech-orbit mc-pro-tech-orbit-a\"><\/div>\r\n    <div class=\"mc-pro-tech-orbit mc-pro-tech-orbit-b\"><\/div>\r\n    <div class=\"mc-pro-tech-node mc-pro-tech-node-a\"><\/div>\r\n    <div class=\"mc-pro-tech-node mc-pro-tech-node-b\"><\/div>\r\n    <div class=\"mc-pro-tech-node mc-pro-tech-node-c\"><\/div>\r\n    <div class=\"mc-pro-tech-scan\"><\/div>\r\n  <\/div>\r\n\r\n  <style>\r\n    .mc-featured-projects {\r\n      background: #070A0B;\r\n      color: #F5F3F5;\r\n      font-family: Inter, Arial, sans-serif;\r\n      padding: 25px 2%;\r\n      margin: 0;\r\n      width: 100%;\r\n      box-sizing: border-box;\r\n      position: relative;\r\n      isolation: isolate;\r\n      overflow: hidden;\r\n    }\r\n\r\n    .mc-featured-projects * { box-sizing: border-box; }\r\n\r\n    .mc-featured-projects::before,\r\n    .mc-featured-projects::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      pointer-events: none;\r\n      z-index: -1;\r\n    }\r\n\r\n    .mc-featured-projects::before {\r\n      inset: -35% -15%;\r\n      background:\r\n        radial-gradient(ellipse at 50% 8%, rgba(25,216,196,.12), transparent 42%),\r\n        radial-gradient(ellipse at 0% 75%, rgba(25,216,196,.055), transparent 32%),\r\n        radial-gradient(ellipse at 100% 85%, rgba(240,160,76,.045), transparent 30%);\r\n      opacity: 0;\r\n      animation: mc-cp-ambient 2s ease-out .15s forwards, mc-cp-drift 16s ease-in-out 2s infinite alternate;\r\n    }\r\n\r\n    .mc-featured-projects::after {\r\n      top: 0;\r\n      bottom: 0;\r\n      left: -30%;\r\n      width: 25%;\r\n      background: linear-gradient(100deg, transparent, rgba(25,216,196,.045), transparent);\r\n      transform: skewX(-18deg);\r\n      animation: mc-cp-light-sweep 7s ease-in-out 1.5s infinite;\r\n    }\r\n\r\n    .mc-featured-projects .mc-projects-heading {\r\n      text-align: center;\r\n      margin: 0 0 20px;\r\n      position: relative;\r\n      opacity: 0;\r\n      transform: translateY(26px);\r\n    }\r\n\r\n    .mc-featured-projects .eyebrow {\r\n      color: #19D8C4;\r\n      font-size: 11px;\r\n      font-weight: 700;\r\n      letter-spacing: 2px;\r\n      text-transform: uppercase;\r\n      margin: 0 0 5px;\r\n      display: inline-block;\r\n      position: relative;\r\n    }\r\n\r\n    .mc-featured-projects .eyebrow::after {\r\n      content: \"\";\r\n      display: block;\r\n      width: 0;\r\n      height: 1px;\r\n      margin: 6px auto 0;\r\n      background: #19D8C4;\r\n      box-shadow: 0 0 10px rgba(25,216,196,.6);\r\n      animation: mc-cp-line-draw 1s cubic-bezier(.2,.75,.25,1) .9s forwards;\r\n    }\r\n\r\n    .mc-featured-projects .mc-projects-heading h2 {\r\n      color: #F5F3F5;\r\n      font-family: \"Space Grotesk\", Inter, Arial, sans-serif;\r\n      font-size: clamp(23px, 2.5vw, 34px);\r\n      line-height: 1.15;\r\n      margin: 0;\r\n      font-weight: 700;\r\n      letter-spacing: -.035em;\r\n    }\r\n\r\n    .mc-featured-projects .mc-projects-heading h2 span {\r\n      color: #19D8C4;\r\n      display: inline-block;\r\n      position: relative;\r\n      text-shadow: 0 0 28px rgba(25,216,196,.12);\r\n      animation: mc-cp-title-breathe 4s ease-in-out 1.5s infinite;\r\n    }\r\n\r\n    .mc-featured-projects .mc-projects-grid {\r\n      display: grid;\r\n      grid-template-columns: repeat(5, minmax(0, 1fr));\r\n      gap: 12px;\r\n      width: 100%;\r\n      margin: 0;\r\n      padding: 0;\r\n      perspective: 1400px;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card {\r\n      min-width: 0;\r\n      overflow: hidden;\r\n      background: #15191D;\r\n      border: 1px solid #343B40;\r\n      border-radius: 9px;\r\n      position: relative;\r\n      isolation: isolate;\r\n      opacity: 0;\r\n      transform: translateY(38px) rotateX(5deg) scale(.975);\r\n      transform-origin: center bottom;\r\n      transition:\r\n        border-color .5s ease,\r\n        box-shadow .6s ease,\r\n        transform .65s cubic-bezier(.2,.8,.2,1),\r\n        background-color .5s ease;\r\n      will-change: transform, opacity;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      z-index: 3;\r\n      top: 0;\r\n      left: -130%;\r\n      width: 75%;\r\n      height: 100%;\r\n      pointer-events: none;\r\n      background: linear-gradient(105deg, transparent 15%, rgba(255,255,255,.10) 48%, rgba(25,216,196,.10) 54%, transparent 82%);\r\n      transform: skewX(-18deg);\r\n      transition: none;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      z-index: 2;\r\n      inset: 0;\r\n      border-radius: inherit;\r\n      pointer-events: none;\r\n      border: 1px solid rgba(25,216,196,0);\r\n      transition: border-color .5s ease, box-shadow .5s ease;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover {\r\n      border-color: #19D8C4;\r\n      background: #171D20;\r\n      box-shadow: 0 22px 55px rgba(0,0,0,.38), 0 0 28px rgba(25,216,196,.09);\r\n      transform: translateY(-9px) rotateX(0) scale(1.015);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover::before {\r\n      animation: mc-cp-card-sheen 1.1s ease forwards;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover::after {\r\n      border-color: rgba(25,216,196,.32);\r\n      box-shadow: inset 0 0 22px rgba(25,216,196,.035);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-image {\r\n      width: 100%;\r\n      aspect-ratio: 1.2 \/ 1;\r\n      overflow: hidden;\r\n      background: #15191D;\r\n      position: relative;\r\n      isolation: isolate;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-image::before {\r\n      content: \"\";\r\n      position: absolute;\r\n      inset: 0;\r\n      z-index: 1;\r\n      pointer-events: none;\r\n      opacity: .48;\r\n      background: linear-gradient(180deg, rgba(7,10,11,0) 42%, rgba(7,10,11,.52) 100%);\r\n      transition: opacity .65s ease;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-image::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      z-index: 1;\r\n      left: 0;\r\n      right: 0;\r\n      bottom: 0;\r\n      height: 2px;\r\n      background: #19D8C4;\r\n      box-shadow: 0 0 14px rgba(25,216,196,.65);\r\n      transform: scaleX(0);\r\n      transform-origin: left;\r\n      transition: transform .65s cubic-bezier(.2,.75,.25,1);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-image img {\r\n      display: block;\r\n      width: 100%;\r\n      height: 100%;\r\n      object-fit: cover;\r\n      margin: 0;\r\n      transform: scale(1.10);\r\n      filter: saturate(.82) contrast(1.04);\r\n      transition: transform 1.4s cubic-bezier(.2,.75,.25,1), filter .8s ease;\r\n      animation: mc-cp-image-settle 1.5s cubic-bezier(.2,.75,.25,1) both;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover .mc-project-image img {\r\n      transform: scale(1.22);\r\n      filter: saturate(1.12) contrast(1.06);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover .mc-project-image::before { opacity: .18; }\r\n    .mc-featured-projects .mc-project-card:hover .mc-project-image::after { transform: scaleX(1); }\r\n\r\n    .mc-featured-projects .mc-project-content {\r\n      padding: 11px;\r\n      position: relative;\r\n      z-index: 1;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-number {\r\n      display: block;\r\n      color: #F0A04C;\r\n      font-size: 10px;\r\n      font-weight: 700;\r\n      letter-spacing: 1px;\r\n      margin-bottom: 5px;\r\n      transition: letter-spacing .45s ease, color .45s ease, transform .45s ease;\r\n      transform: translateX(0);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover .mc-project-number {\r\n      letter-spacing: 1.8px;\r\n      color: #F5B66F;\r\n      transform: translateX(2px);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-content h3 {\r\n      color: #F5F3F5;\r\n      font-family: \"Space Grotesk\", Inter, Arial, sans-serif;\r\n      font-size: 15px;\r\n      line-height: 1.3;\r\n      font-weight: 700;\r\n      margin: 0 0 6px;\r\n      overflow-wrap: anywhere;\r\n      transition: color .4s ease, transform .45s cubic-bezier(.2,.75,.25,1);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover .mc-project-content h3 {\r\n      color: #FFFFFF;\r\n      transform: translateX(3px);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-content p {\r\n      color: #AEB8BD;\r\n      font-size: 12px;\r\n      line-height: 1.5;\r\n      margin: 0;\r\n      overflow-wrap: anywhere;\r\n      transition: color .45s ease;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover .mc-project-content p { color: #D0D8DB; }\r\n\r\n    \/* 3D flip interaction: the card turns on pointer hover\/focus *\/\r\n    .mc-featured-projects .mc-project-card {\r\n      perspective: 1100px;\r\n      transform-style: preserve-3d;\r\n      cursor: pointer;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card .mc-project-image,\r\n    .mc-featured-projects .mc-project-card .mc-project-content {\r\n      backface-visibility: hidden;\r\n      -webkit-backface-visibility: hidden;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card {\r\n      transition:\r\n        border-color .45s ease,\r\n        box-shadow .5s ease,\r\n        transform .8s cubic-bezier(.2,.75,.25,1),\r\n        background-color .45s ease;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover {\r\n      animation: mc-cp-cursor-flip .75s cubic-bezier(.2,.75,.25,1) both;\r\n      transform: translateY(-5px) scale(1.015);\r\n    }\r\n\r\n    \/* Content stays readable while the whole card pivots toward the cursor *\/\r\n    .mc-featured-projects .mc-project-card:hover .mc-project-image img {\r\n      transform: scale(1.14);\r\n      filter: saturate(1.12) contrast(1.06);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:focus-within {\r\n      outline: 2px solid #19D8C4;\r\n      outline-offset: 3px;\r\n    }\r\n\r\n    @media (hover: hover) and (pointer: fine) {\r\n      .mc-featured-projects .mc-project-card:hover {\r\n        animation: mc-cp-cursor-flip .75s cubic-bezier(.2,.75,.25,1) both;\r\n      }\r\n      .mc-featured-projects .mc-project-card:nth-child(even):hover {\r\n        animation-name: mc-cp-cursor-flip-reverse;\r\n      }\r\n    }\r\n\r\n    \/* Scroll-triggered entrance. Animation plays once when section enters view. *\/\r\n    .mc-featured-projects.mc-cp-js .mc-projects-heading,\r\n    .mc-featured-projects.mc-cp-js .mc-project-card {\r\n      animation: none;\r\n      opacity: 0;\r\n    }\r\n\r\n    .mc-featured-projects.mc-cp-js.mc-cp-visible .mc-projects-heading {\r\n      animation: mc-cp-heading-in 1s cubic-bezier(.16,1,.3,1) .08s forwards;\r\n    }\r\n\r\n    .mc-featured-projects.mc-cp-js.mc-cp-visible .mc-project-card {\r\n      animation: mc-cp-card-reveal 1.1s cubic-bezier(.16,1,.3,1) forwards;\r\n    }\r\n\r\n    .mc-featured-projects.mc-cp-js.mc-cp-visible .mc-project-card:nth-child(1) { animation-delay: .16s; }\r\n    .mc-featured-projects.mc-cp-js.mc-cp-visible .mc-project-card:nth-child(2) { animation-delay: .31s; }\r\n    .mc-featured-projects.mc-cp-js.mc-cp-visible .mc-project-card:nth-child(3) { animation-delay: .46s; }\r\n    .mc-featured-projects.mc-cp-js.mc-cp-visible .mc-project-card:nth-child(4) { animation-delay: .61s; }\r\n    .mc-featured-projects.mc-cp-js.mc-cp-visible .mc-project-card:nth-child(5) { animation-delay: .76s; }\r\n\r\n    @keyframes mc-cp-heading-in {\r\n      0% { opacity: 0; transform: translateY(28px); filter: blur(7px); }\r\n      65% { filter: blur(0); }\r\n      100% { opacity: 1; transform: translateY(0); filter: blur(0); }\r\n    }\r\n\r\n    @keyframes mc-cp-card-reveal {\r\n      0% { opacity: 0; transform: translateY(42px) rotateX(7deg) scale(.97); filter: blur(5px); }\r\n      70% { filter: blur(0); }\r\n      100% { opacity: 1; transform: translateY(0) rotateX(0) scale(1); filter: blur(0); }\r\n    }\r\n\r\n    @keyframes mc-cp-ambient { from { opacity: 0; } to { opacity: 1; } }\r\n    @keyframes mc-cp-drift { from { transform: translate3d(-1%, -1%, 0) scale(1); } to { transform: translate3d(1%, 1%, 0) scale(1.06); } }\r\n    @keyframes mc-cp-light-sweep {\r\n      0%, 12% { left: -30%; opacity: 0; }\r\n      22% { opacity: 1; }\r\n      48% { left: 115%; opacity: .8; }\r\n      49%, 100% { left: 115%; opacity: 0; }\r\n    }\r\n    @keyframes mc-cp-line-draw { to { width: 48px; } }\r\n    @keyframes mc-cp-title-breathe {\r\n      0%, 100% { text-shadow: 0 0 0 rgba(25,216,196,0); }\r\n      50% { text-shadow: 0 0 22px rgba(25,216,196,.27); }\r\n    }\r\n    @keyframes mc-cp-card-sheen { from { left: -130%; } to { left: 160%; } }\r\n    @keyframes mc-cp-image-settle {\r\n      from { transform: scale(1.18); }\r\n      to { transform: scale(1.10); }\r\n    }\r\n\r\n    @keyframes mc-cp-cursor-flip {\r\n      0% { transform: perspective(1100px) rotateY(0deg) rotateX(0deg) translateY(0) scale(1); }\r\n      42% { transform: perspective(1100px) rotateY(92deg) rotateX(2deg) translateY(-4px) scale(1.015); }\r\n      58% { transform: perspective(1100px) rotateY(92deg) rotateX(2deg) translateY(-4px) scale(1.015); }\r\n      100% { transform: perspective(1100px) rotateY(0deg) rotateX(0deg) translateY(-5px) scale(1.015); }\r\n    }\r\n\r\n    @keyframes mc-cp-cursor-flip-reverse {\r\n      0% { transform: perspective(1100px) rotateY(0deg) rotateX(0deg) translateY(0) scale(1); }\r\n      42% { transform: perspective(1100px) rotateY(-92deg) rotateX(2deg) translateY(-4px) scale(1.015); }\r\n      58% { transform: perspective(1100px) rotateY(-92deg) rotateX(2deg) translateY(-4px) scale(1.015); }\r\n      100% { transform: perspective(1100px) rotateY(0deg) rotateX(0deg) translateY(-5px) scale(1.015); }\r\n    }\r\n\r\n    @media (max-width: 1024px) and (min-width: 768px) {\r\n      .mc-featured-projects .mc-projects-grid {\r\n        grid-template-columns: repeat(3, minmax(0, 1fr));\r\n      }\r\n    }\r\n\r\n    @media (max-width: 767px) {\r\n      .mc-featured-projects { padding: 20px 12px; }\r\n      .mc-featured-projects .mc-projects-grid {\r\n        display: grid;\r\n        grid-template-columns: repeat(5, 145px);\r\n        gap: 10px;\r\n        overflow-x: auto;\r\n        padding: 0 0 8px;\r\n        scrollbar-width: thin;\r\n        scroll-snap-type: x mandatory;\r\n        -webkit-overflow-scrolling: touch;\r\n      }\r\n      .mc-featured-projects .mc-project-card { scroll-snap-align: start; }\r\n      .mc-featured-projects .mc-project-content { padding: 10px; }\r\n      .mc-featured-projects .mc-project-content h3 { font-size: 13px; }\r\n      .mc-featured-projects .mc-project-content p { font-size: 11px; }\r\n      .mc-featured-projects .mc-project-card:hover { transform: translateY(-3px); }\r\n    }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .mc-featured-projects *,\r\n      .mc-featured-projects *::before,\r\n      .mc-featured-projects *::after {\r\n        animation-duration: .01ms !important;\r\n        animation-iteration-count: 1 !important;\r\n        transition-duration: .01ms !important;\r\n        scroll-behavior: auto !important;\r\n      }\r\n      .mc-featured-projects .mc-project-card,\r\n      .mc-featured-projects .mc-projects-heading,\r\n      .mc-featured-projects.mc-cp-js .mc-project-card,\r\n      .mc-featured-projects.mc-cp-js .mc-projects-heading {\r\n        opacity: 1 !important;\r\n        transform: none !important;\r\n        filter: none !important;\r\n      }\r\n    }\r\n\r\n    \/* =========================================================\r\n       PREMIUM CS \/ DIGITAL LAB MOTION DESIGN\r\n       Fine circuit grid, flowing traces, soft depth and precise\r\n       card motion. Keeps all existing content and image URLs.\r\n       ========================================================= *\/\r\n    .mc-featured-projects {\r\n      position: relative;\r\n      isolation: isolate;\r\n      overflow: hidden;\r\n      background: #070A0B !important;\r\n    }\r\n\r\n    .mc-featured-projects .mc-pro-tech-background {\r\n      position: absolute;\r\n      z-index: -1;\r\n      inset: 0;\r\n      overflow: hidden;\r\n      pointer-events: none;\r\n      background:\r\n        radial-gradient(ellipse at 50% -15%, rgba(25,216,196,.12), transparent 50%),\r\n        radial-gradient(ellipse at 100% 80%, rgba(240,160,76,.045), transparent 35%),\r\n        #070A0B;\r\n    }\r\n\r\n    .mc-featured-projects .mc-pro-tech-grid {\r\n      position: absolute;\r\n      inset: -20%;\r\n      opacity: .22;\r\n      background-image:\r\n        linear-gradient(rgba(86,119,122,.12) 1px, transparent 1px),\r\n        linear-gradient(90deg, rgba(86,119,122,.12) 1px, transparent 1px);\r\n      background-size: 46px 46px;\r\n      mask-image: linear-gradient(to bottom, transparent 0%, #000 20%, #000 78%, transparent 100%);\r\n      animation: mc-pro-grid-drift 34s linear infinite;\r\n    }\r\n\r\n    .mc-featured-projects .mc-pro-tech-orbit {\r\n      position: absolute;\r\n      width: clamp(260px, 38vw, 560px);\r\n      aspect-ratio: 1;\r\n      border: 1px solid rgba(25,216,196,.12);\r\n      border-radius: 50%;\r\n      box-shadow: inset 0 0 70px rgba(25,216,196,.025), 0 0 70px rgba(25,216,196,.025);\r\n      opacity: .7;\r\n    }\r\n\r\n    .mc-featured-projects .mc-pro-tech-orbit::before,\r\n    .mc-featured-projects .mc-pro-tech-orbit::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      border: 1px solid rgba(25,216,196,.09);\r\n      border-radius: 50%;\r\n      inset: 9%;\r\n    }\r\n\r\n    .mc-featured-projects .mc-pro-tech-orbit::after {\r\n      inset: 20%;\r\n      border-color: rgba(240,160,76,.09);\r\n    }\r\n\r\n    .mc-featured-projects .mc-pro-tech-orbit-a {\r\n      top: -52%;\r\n      left: -15%;\r\n      animation: mc-pro-orbit-a 28s linear infinite;\r\n    }\r\n\r\n    .mc-featured-projects .mc-pro-tech-orbit-b {\r\n      right: -18%;\r\n      bottom: -65%;\r\n      width: clamp(300px, 44vw, 650px);\r\n      animation: mc-pro-orbit-b 36s linear infinite reverse;\r\n    }\r\n\r\n    .mc-featured-projects .mc-pro-tech-node {\r\n      position: absolute;\r\n      width: 5px;\r\n      height: 5px;\r\n      border-radius: 50%;\r\n      background: #19D8C4;\r\n      box-shadow: 0 0 0 5px rgba(25,216,196,.06), 0 0 18px rgba(25,216,196,.75);\r\n      opacity: .7;\r\n      animation: mc-pro-node-pulse 4s ease-in-out infinite;\r\n    }\r\n\r\n    .mc-featured-projects .mc-pro-tech-node-a { top: 18%; left: 18%; }\r\n    .mc-featured-projects .mc-pro-tech-node-b { top: 58%; right: 12%; animation-delay: -1.3s; }\r\n    .mc-featured-projects .mc-pro-tech-node-c {\r\n      top: 78%; left: 63%;\r\n      background: #F0A04C;\r\n      box-shadow: 0 0 0 5px rgba(240,160,76,.055), 0 0 18px rgba(240,160,76,.5);\r\n      animation-delay: -2.4s;\r\n    }\r\n\r\n    .mc-featured-projects .mc-pro-tech-scan {\r\n      position: absolute;\r\n      top: -35%;\r\n      left: 0;\r\n      width: 100%;\r\n      height: 22%;\r\n      background: linear-gradient(180deg, transparent, rgba(25,216,196,.035), transparent);\r\n      opacity: .75;\r\n      animation: mc-pro-scan 12s ease-in-out infinite;\r\n    }\r\n\r\n    .mc-featured-projects .mc-projects-heading,\r\n    .mc-featured-projects .mc-projects-grid {\r\n      position: relative;\r\n      z-index: 1;\r\n    }\r\n\r\n    \/* Replace the old card flip with a more polished product-gallery interaction. *\/\r\n    .mc-featured-projects .mc-project-card {\r\n      transform-style: flat;\r\n      cursor: default;\r\n      transition:\r\n        border-color .35s ease,\r\n        box-shadow .45s ease,\r\n        transform .45s cubic-bezier(.2,.75,.25,1),\r\n        background-color .35s ease;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover,\r\n    .mc-featured-projects .mc-project-card:nth-child(even):hover {\r\n      animation: none !important;\r\n      transform: translateY(-6px) scale(1.008);\r\n      border-color: rgba(25,216,196,.72);\r\n      box-shadow: 0 18px 44px rgba(0,0,0,.34), 0 0 0 1px rgba(25,216,196,.07);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover .mc-project-image img {\r\n      transform: scale(1.075);\r\n      filter: saturate(1.05) contrast(1.04);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card::before {\r\n      opacity: 0;\r\n      transition: opacity .3s ease;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover::before {\r\n      opacity: 1;\r\n      animation: mc-cp-card-sheen 1.15s ease forwards;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-image::after {\r\n      height: 2px;\r\n      box-shadow: 0 0 10px rgba(25,216,196,.4);\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-content h3 {\r\n      transition: color .3s ease;\r\n    }\r\n\r\n    .mc-featured-projects .mc-project-card:hover .mc-project-content h3 {\r\n      transform: none;\r\n      color: #19D8C4;\r\n    }\r\n\r\n    @keyframes mc-pro-grid-drift {\r\n      from { transform: translate3d(0, 0, 0); }\r\n      to { transform: translate3d(46px, 46px, 0); }\r\n    }\r\n\r\n    @keyframes mc-pro-orbit-a {\r\n      from { transform: rotate(0deg) translate3d(0, 0, 0); }\r\n      to { transform: rotate(360deg) translate3d(12px, 8px, 0); }\r\n    }\r\n\r\n    @keyframes mc-pro-orbit-b {\r\n      from { transform: rotate(0deg) scale(1); }\r\n      to { transform: rotate(360deg) scale(1.05); }\r\n    }\r\n\r\n    @keyframes mc-pro-node-pulse {\r\n      0%, 100% { opacity: .38; transform: scale(.82); }\r\n      50% { opacity: .95; transform: scale(1.15); }\r\n    }\r\n\r\n    @keyframes mc-pro-scan {\r\n      0% { transform: translateY(0); opacity: 0; }\r\n      15% { opacity: .75; }\r\n      75% { opacity: .5; }\r\n      100% { transform: translateY(620%); opacity: 0; }\r\n    }\r\n\r\n    @media (max-width: 767px) {\r\n      .mc-featured-projects .mc-pro-tech-grid { background-size: 34px 34px; }\r\n      .mc-featured-projects .mc-pro-tech-orbit { opacity: .45; }\r\n      .mc-featured-projects .mc-project-card:hover,\r\n      .mc-featured-projects .mc-project-card:nth-child(even):hover {\r\n        transform: translateY(-3px);\r\n      }\r\n    }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .mc-featured-projects .mc-pro-tech-grid,\r\n      .mc-featured-projects .mc-pro-tech-orbit,\r\n      .mc-featured-projects .mc-pro-tech-node,\r\n      .mc-featured-projects .mc-pro-tech-scan {\r\n        animation: none !important;\r\n      }\r\n    }\r\n\r\n  <\/style>\r\n\r\n  <div class=\"mc-projects-heading\">\r\n    <p class=\"eyebrow\">Ideas into reality<\/p>\r\n    <h2>Featured <span>Projects<\/span><\/h2>\r\n  <\/div>\r\n\r\n  <div class=\"mc-projects-grid\">\r\n\r\n    <article class=\"mc-project-card\">\r\n      <div class=\"mc-project-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.47.41-AM.webp\" alt=\"Maker Club project one\" loading=\"lazy\">\r\n      <\/div>\r\n      <div class=\"mc-project-content\">\r\n        <span class=\"mc-project-number\">PROJECT 01<\/span>\r\n        <h3>Digital Making<\/h3>\r\n        <p>Creative ideas brought to life through digital tools and practical making.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <article class=\"mc-project-card\">\r\n      <div class=\"mc-project-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.58.48-AM.webp\" alt=\"Maker Club project two\" loading=\"lazy\">\r\n      <\/div>\r\n      <div class=\"mc-project-content\">\r\n        <span class=\"mc-project-number\">PROJECT 02<\/span>\r\n        <h3>3D Fabrication<\/h3>\r\n        <p>Turning digital designs into physical objects through fabrication.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <article class=\"mc-project-card\">\r\n      <div class=\"mc-project-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.31.44-AM.webp\" alt=\"Maker Club project three\" loading=\"lazy\">\r\n      <\/div>\r\n      <div class=\"mc-project-content\">\r\n        <span class=\"mc-project-number\">PROJECT 03<\/span>\r\n        <h3>Electronics<\/h3>\r\n        <p>Exploring circuits, components and hands-on electronic prototypes.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <article class=\"mc-project-card\">\r\n      <div class=\"mc-project-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.33.00-AM.webp\" alt=\"Maker Club project four\" loading=\"lazy\">\r\n      <\/div>\r\n      <div class=\"mc-project-content\">\r\n        <span class=\"mc-project-number\">PROJECT 04<\/span>\r\n        <h3>Creative Design<\/h3>\r\n        <p>Experimenting with concepts, materials and new design approaches.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <article class=\"mc-project-card\">\r\n      <div class=\"mc-project-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.33.03-AM.webp\" alt=\"Maker Club project five\" loading=\"lazy\">\r\n      <\/div>\r\n      <div class=\"mc-project-content\">\r\n        <span class=\"mc-project-number\">PROJECT 05<\/span>\r\n        <h3>Prototype Lab<\/h3>\r\n        <p>Testing ideas, improving designs and building working prototypes.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n  <\/div>\r\n\r\n  <script>\r\n    (function () {\r\n      function initFeaturedProjects() {\r\n        var sections = document.querySelectorAll('.mc-featured-projects');\r\n        sections.forEach(function (section) {\r\n          if (section.dataset.mcCpReady === 'true') return;\r\n          section.dataset.mcCpReady = 'true';\r\n          section.classList.add('mc-cp-js');\r\n\r\n          if ('IntersectionObserver' in window) {\r\n            var observer = new IntersectionObserver(function (entries) {\r\n              entries.forEach(function (entry) {\r\n                if (entry.isIntersecting) {\r\n                  section.classList.add('mc-cp-visible');\r\n                  observer.unobserve(section);\r\n                }\r\n              });\r\n            }, { threshold: 0.1, rootMargin: '0px 0px -4% 0px' });\r\n            observer.observe(section);\r\n          } else {\r\n            section.classList.add('mc-cp-visible');\r\n          }\r\n        });\r\n      }\r\n\r\n      if (document.readyState === 'loading') {\r\n        document.addEventListener('DOMContentLoaded', initFeaturedProjects, { once: true });\r\n      } else {\r\n        initFeaturedProjects();\r\n      }\r\n    })();\r\n  <\/script>\r\n<\/section>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7f90bec e-con-full e-flex e-con e-parent\" data-id=\"7f90bec\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8be3308 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"8be3308\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"mc-what-we-make\">\r\n  <!-- Engineering-inspired motion layer: signal paths, node pulses and drafting grid -->\r\n  <div class=\"mc-engineering-visual\" aria-hidden=\"true\">\r\n    <div class=\"mc-engineering-grid\"><\/div>\r\n    <svg class=\"mc-engineering-circuit\" viewBox=\"0 0 1200 620\" preserveAspectRatio=\"none\" focusable=\"false\">\r\n      <path class=\"mc-circuit-path mc-circuit-path-a\" d=\"M-30 130 H170 V210 H300 V145 H445 V235 H610 V170 H790 V250 H940 V185 H1230\" \/>\r\n      <path class=\"mc-circuit-path mc-circuit-path-b\" d=\"M-30 470 H145 V390 H285 V455 H470 V365 H650 V435 H820 V350 H1010 V420 H1230\" \/>\r\n      <path class=\"mc-circuit-path mc-circuit-path-c\" d=\"M600 -30 V85 H700 V160 H820 V235 H900 V320 H1020 V620\" \/>\r\n      <circle class=\"mc-circuit-node node-a\" cx=\"300\" cy=\"145\" r=\"4\" \/>\r\n      <circle class=\"mc-circuit-node node-b\" cx=\"610\" cy=\"170\" r=\"4\" \/>\r\n      <circle class=\"mc-circuit-node node-c\" cx=\"285\" cy=\"455\" r=\"4\" \/>\r\n      <circle class=\"mc-circuit-node node-d\" cx=\"820\" cy=\"350\" r=\"4\" \/>\r\n      <circle class=\"mc-circuit-node node-e\" cx=\"900\" cy=\"320\" r=\"4\" \/>\r\n    <\/svg>\r\n    <div class=\"mc-engineering-scan\"><\/div>\r\n  <\/div>\r\n\r\n  <p class=\"mc-eyebrow\">TOOLS, TECHNOLOGY &amp; IMAGINATION<\/p>\r\n\r\n  <h2>\r\n    Different skills.<br>\r\n    <span>One creative community.<\/span>\r\n  <\/h2>\r\n\r\n  <p class=\"mc-intro\">\r\n    We bring ideas to life through a mix of technology,\r\n    practical skills and creative thinking.\r\n  <\/p>\r\n\r\n  <div class=\"mc-category-grid\">\r\n\r\n    <article class=\"mc-category\">\r\n      <span class=\"mc-category-number\">01 \/ CODE<\/span>\r\n      <div class=\"mc-category-icon\">&lt;\/&gt;<\/div>\r\n      <h3>Digital Making<\/h3>\r\n      <p>Web experiences, creative coding, digital tools and interactive ideas.<\/p>\r\n    <\/article>\r\n\r\n    <article class=\"mc-category\">\r\n      <span class=\"mc-category-number\">02 \/ CIRCUITS<\/span>\r\n      <div class=\"mc-category-icon\">\u2301<\/div>\r\n      <h3>Electronics<\/h3>\r\n      <p>Circuits, sensors, microcontrollers and connected inventions.<\/p>\r\n    <\/article>\r\n\r\n    <article class=\"mc-category\">\r\n      <span class=\"mc-category-number\">03 \/ BUILD<\/span>\r\n      <div class=\"mc-category-icon\">\u25c7<\/div>\r\n      <h3>Fabrication<\/h3>\r\n      <p>3D printing, physical prototyping and turning models into objects.<\/p>\r\n    <\/article>\r\n\r\n    <article class=\"mc-category\">\r\n      <span class=\"mc-category-number\">04 \/ FORM<\/span>\r\n      <div class=\"mc-category-icon\">\u2733<\/div>\r\n      <h3>Design<\/h3>\r\n      <p>Product concepts, visual communication and user-focused solutions.<\/p>\r\n    <\/article>\r\n\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n.mc-what-we-make,\r\n.mc-what-we-make * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.mc-what-we-make {\r\n  width: 100%;\r\n  margin: 0 !important;\r\n  padding: 28px 3% !important;\r\n  background: #070A0B;\r\n  color: #F5F3F5;\r\n  font-family: 'Inter', Arial, sans-serif;\r\n  overflow: hidden;\r\n  position: relative;\r\n  isolation: isolate;\r\n}\r\n\r\n\/* Atmospheric cinematic lighting *\/\r\n.mc-what-we-make::before,\r\n.mc-what-we-make::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  pointer-events: none;\r\n  z-index: -1;\r\n}\r\n\r\n.mc-what-we-make::before {\r\n  inset: -30% -20%;\r\n  background:\r\n    radial-gradient(ellipse at 18% 20%, rgba(25,216,196,.10), transparent 34%),\r\n    radial-gradient(ellipse at 80% 75%, rgba(240,160,76,.045), transparent 30%);\r\n  opacity: 0;\r\n  animation: mc-wm-atmosphere 1.8s ease-out .15s forwards, mc-wm-drift 18s ease-in-out 2s infinite alternate;\r\n}\r\n\r\n.mc-what-we-make::after {\r\n  top: -20%;\r\n  bottom: -20%;\r\n  left: -45%;\r\n  width: 28%;\r\n  transform: skewX(-20deg);\r\n  background: linear-gradient(90deg, transparent, rgba(25,216,196,.055), rgba(255,255,255,.025), transparent);\r\n  animation: mc-wm-light-sweep 9s ease-in-out 1.4s infinite;\r\n}\r\n\r\n.mc-what-we-make .mc-eyebrow {\r\n  color: #19D8C4;\r\n  font-size: 11px;\r\n  font-weight: 800;\r\n  letter-spacing: 2px;\r\n  line-height: 1.4;\r\n  margin: 0 0 10px !important;\r\n  width: fit-content;\r\n  opacity: 0;\r\n  transform: translateY(14px);\r\n  position: relative;\r\n}\r\n\r\n.mc-what-we-make .mc-eyebrow::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  left: 0;\r\n  bottom: -5px;\r\n  width: 0;\r\n  height: 1px;\r\n  background: #19D8C4;\r\n  box-shadow: 0 0 10px rgba(25,216,196,.5);\r\n}\r\n\r\n.mc-what-we-make h2 {\r\n  color: #F5F3F5;\r\n  font-family: 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  font-size: clamp(28px, 3.4vw, 44px);\r\n  font-weight: 800;\r\n  line-height: 1.12;\r\n  letter-spacing: -1px;\r\n  margin: 0 0 10px !important;\r\n  opacity: 0;\r\n  transform: translateY(22px);\r\n  filter: blur(5px);\r\n}\r\n\r\n.mc-what-we-make h2 span {\r\n  color: #19D8C4;\r\n  display: inline-block;\r\n  transform-origin: left center;\r\n}\r\n\r\n.mc-what-we-make .mc-intro {\r\n  max-width: 650px;\r\n  color: #AEB8BD;\r\n  font-size: 14px;\r\n  line-height: 1.6;\r\n  margin: 0 0 22px !important;\r\n  opacity: 0;\r\n  transform: translateY(15px);\r\n}\r\n\r\n.mc-what-we-make .mc-category-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(4, minmax(0, 1fr));\r\n  border-top: 1px solid #343B40;\r\n  border-bottom: 1px solid #343B40;\r\n  margin: 0;\r\n  padding: 0;\r\n  perspective: 1200px;\r\n}\r\n\r\n.mc-what-we-make .mc-category {\r\n  min-width: 0;\r\n  padding: 18px 16px;\r\n  margin: 0;\r\n  background: transparent;\r\n  border-right: 1px solid #343B40;\r\n  position: relative;\r\n  overflow: hidden;\r\n  transform: translateY(30px);\r\n  opacity: 0;\r\n  transition:\r\n    background .45s ease,\r\n    transform .65s cubic-bezier(.2,.75,.25,1),\r\n    border-color .45s ease,\r\n    box-shadow .45s ease;\r\n}\r\n\r\n.mc-what-we-make .mc-category::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  top: -120%;\r\n  left: -60%;\r\n  width: 70%;\r\n  height: 340%;\r\n  pointer-events: none;\r\n  opacity: 0;\r\n  transform: rotate(24deg);\r\n  background: linear-gradient(90deg, transparent, rgba(25,216,196,.09), rgba(255,255,255,.035), transparent);\r\n}\r\n\r\n.mc-what-we-make .mc-category::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  bottom: 0;\r\n  left: 0;\r\n  height: 2px;\r\n  width: 100%;\r\n  background: #19D8C4;\r\n  box-shadow: 0 0 14px rgba(25,216,196,.42);\r\n  transform: scaleX(0);\r\n  transform-origin: left;\r\n  transition: transform .55s cubic-bezier(.2,.75,.25,1);\r\n}\r\n\r\n.mc-what-we-make .mc-category:first-child {\r\n  padding-left: 0;\r\n}\r\n\r\n.mc-what-we-make .mc-category:last-child {\r\n  border-right: 0;\r\n}\r\n\r\n.mc-what-we-make .mc-category:hover {\r\n  background: #15191D;\r\n  transform: translateY(-5px);\r\n  border-color: rgba(25,216,196,.4);\r\n  box-shadow: 0 12px 28px rgba(0,0,0,.18);\r\n}\r\n\r\n.mc-what-we-make .mc-category:hover::before {\r\n  opacity: 1;\r\n  animation: mc-wm-card-sheen 1s ease forwards;\r\n}\r\n\r\n.mc-what-we-make .mc-category:hover::after {\r\n  transform: scaleX(1);\r\n}\r\n\r\n.mc-what-we-make .mc-category-number {\r\n  display: block;\r\n  color: #19D8C4;\r\n  font-size: 10px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.5px;\r\n  line-height: 1.5;\r\n  margin: 0;\r\n  transition: letter-spacing .35s ease, transform .35s ease;\r\n}\r\n\r\n.mc-what-we-make .mc-category:hover .mc-category-number {\r\n  letter-spacing: 2px;\r\n  transform: translateX(2px);\r\n}\r\n\r\n.mc-what-we-make .mc-category-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 48px;\r\n  height: 48px;\r\n  margin: 14px 0;\r\n  border: 1px solid #343B40;\r\n  border-radius: 7px;\r\n  background: #15191D;\r\n  color: #19D8C4;\r\n  font-family: 'Space Grotesk', Arial, sans-serif;\r\n  font-size: 25px;\r\n  font-weight: 700;\r\n  transition:\r\n    color .4s ease,\r\n    border-color .4s ease,\r\n    background .4s ease,\r\n    transform .65s cubic-bezier(.2,.75,.25,1),\r\n    box-shadow .4s ease;\r\n  transform: translateZ(0) rotate(0deg);\r\n}\r\n\r\n.mc-what-we-make .mc-category:hover .mc-category-icon {\r\n  color: #F0A04C;\r\n  border-color: #F0A04C;\r\n  background: #1A1D20;\r\n  transform: translateY(-2px) rotate(8deg) scale(1.08);\r\n  box-shadow: 0 0 22px rgba(240,160,76,.08);\r\n}\r\n\r\n.mc-what-we-make .mc-category h3 {\r\n  color: #F5F3F5;\r\n  font-family: 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  font-size: clamp(16px, 1.5vw, 20px);\r\n  font-weight: 700;\r\n  line-height: 1.3;\r\n  margin: 0 0 7px !important;\r\n  transition: transform .4s ease, color .4s ease;\r\n}\r\n\r\n.mc-what-we-make .mc-category:hover h3 {\r\n  transform: translateX(3px);\r\n  color: #FFFFFF;\r\n}\r\n\r\n.mc-what-we-make .mc-category p {\r\n  color: #AEB8BD;\r\n  font-size: 12px;\r\n  font-weight: 400;\r\n  line-height: 1.6;\r\n  margin: 0 !important;\r\n  min-height: 0;\r\n  transition: color .4s ease;\r\n}\r\n\r\n.mc-what-we-make .mc-category:hover p {\r\n  color: #D0D8DB;\r\n}\r\n\r\n\/* Scroll-triggered cinematic reveal *\/\r\n.mc-what-we-make.mc-wm-ready .mc-eyebrow,\r\n.mc-what-we-make.mc-wm-ready h2,\r\n.mc-what-we-make.mc-wm-ready .mc-intro,\r\n.mc-what-we-make.mc-wm-ready .mc-category {\r\n  animation: none;\r\n}\r\n\r\n.mc-what-we-make.mc-wm-ready.mc-wm-visible .mc-eyebrow {\r\n  animation: mc-wm-rise .8s cubic-bezier(.16,1,.3,1) .08s forwards;\r\n}\r\n\r\n.mc-what-we-make.mc-wm-ready.mc-wm-visible .mc-eyebrow::after {\r\n  animation: mc-wm-underline .8s cubic-bezier(.2,.75,.25,1) .65s forwards;\r\n}\r\n\r\n.mc-what-we-make.mc-wm-ready.mc-wm-visible h2 {\r\n  animation: mc-wm-title-reveal 1.1s cubic-bezier(.16,1,.3,1) .2s forwards;\r\n}\r\n\r\n.mc-what-we-make.mc-wm-ready.mc-wm-visible h2 span {\r\n  animation: mc-wm-teal-glow 3.8s ease-in-out 1.6s infinite;\r\n}\r\n\r\n.mc-what-we-make.mc-wm-ready.mc-wm-visible .mc-intro {\r\n  animation: mc-wm-rise .85s cubic-bezier(.16,1,.3,1) .42s forwards;\r\n}\r\n\r\n.mc-what-we-make.mc-wm-ready.mc-wm-visible .mc-category {\r\n  animation: mc-wm-category-reveal .95s cubic-bezier(.16,1,.3,1) forwards;\r\n}\r\n\r\n.mc-what-we-make.mc-wm-ready.mc-wm-visible .mc-category:nth-child(1) { animation-delay: .48s; }\r\n.mc-what-we-make.mc-wm-ready.mc-wm-visible .mc-category:nth-child(2) { animation-delay: .62s; }\r\n.mc-what-we-make.mc-wm-ready.mc-wm-visible .mc-category:nth-child(3) { animation-delay: .76s; }\r\n.mc-what-we-make.mc-wm-ready.mc-wm-visible .mc-category:nth-child(4) { animation-delay: .90s; }\r\n\r\n@keyframes mc-wm-atmosphere { to { opacity: 1; } }\r\n@keyframes mc-wm-drift {\r\n  from { transform: translate3d(-1%, -1%, 0) scale(1); }\r\n  to { transform: translate3d(1%, 1%, 0) scale(1.06); }\r\n}\r\n@keyframes mc-wm-light-sweep {\r\n  0%, 10% { left: -45%; opacity: 0; }\r\n  18% { opacity: 1; }\r\n  45% { left: 125%; opacity: .8; }\r\n  46%, 100% { left: 125%; opacity: 0; }\r\n}\r\n@keyframes mc-wm-rise {\r\n  from { opacity: 0; transform: translateY(18px); }\r\n  to { opacity: 1; transform: translateY(0); }\r\n}\r\n@keyframes mc-wm-title-reveal {\r\n  0% { opacity: 0; transform: translateY(24px); filter: blur(7px); }\r\n  65% { filter: blur(0); }\r\n  100% { opacity: 1; transform: translateY(0); filter: blur(0); }\r\n}\r\n@keyframes mc-wm-underline { to { width: 100%; } }\r\n@keyframes mc-wm-teal-glow {\r\n  0%, 100% { text-shadow: 0 0 0 rgba(25,216,196,0); }\r\n  50% { text-shadow: 0 0 22px rgba(25,216,196,.24); }\r\n}\r\n@keyframes mc-wm-category-reveal {\r\n  0% { opacity: 0; transform: translateY(32px) rotateX(5deg); filter: blur(4px); }\r\n  70% { filter: blur(0); }\r\n  100% { opacity: 1; transform: translateY(0) rotateX(0); filter: blur(0); }\r\n}\r\n@keyframes mc-wm-card-sheen {\r\n  from { top: -120%; left: -60%; }\r\n  to { top: -120%; left: 130%; }\r\n}\r\n\r\n\/* Tablet *\/\r\n@media (max-width: 1024px) {\r\n  .mc-what-we-make {\r\n    padding: 25px 4% !important;\r\n  }\r\n\r\n  .mc-what-we-make .mc-category-grid {\r\n    grid-template-columns: repeat(2, minmax(0, 1fr));\r\n  }\r\n\r\n  .mc-what-we-make .mc-category,\r\n  .mc-what-we-make .mc-category:first-child {\r\n    padding: 18px;\r\n    border-bottom: 1px solid #343B40;\r\n  }\r\n\r\n  .mc-what-we-make .mc-category:nth-child(odd) {\r\n    border-right: 1px solid #343B40;\r\n  }\r\n\r\n  .mc-what-we-make .mc-category:nth-child(even) {\r\n    border-right: 0;\r\n  }\r\n\r\n  .mc-what-we-make .mc-category:nth-last-child(-n+2) {\r\n    border-bottom: 0;\r\n  }\r\n}\r\n\r\n\/* Mobile *\/\r\n@media (max-width: 600px) {\r\n  .mc-what-we-make {\r\n    padding: 22px 5% !important;\r\n  }\r\n\r\n  .mc-what-we-make .mc-eyebrow {\r\n    font-size: 9px;\r\n    letter-spacing: 1.5px;\r\n    margin-bottom: 9px !important;\r\n  }\r\n\r\n  .mc-what-we-make h2 {\r\n    font-size: clamp(27px, 7.5vw, 36px);\r\n    letter-spacing: -0.6px;\r\n    line-height: 1.15;\r\n    margin-bottom: 9px !important;\r\n  }\r\n\r\n  .mc-what-we-make .mc-intro {\r\n    font-size: 13px;\r\n    line-height: 1.6;\r\n    margin-bottom: 18px !important;\r\n  }\r\n\r\n  .mc-what-we-make .mc-category-grid {\r\n    grid-template-columns: 1fr;\r\n  }\r\n\r\n  .mc-what-we-make .mc-category,\r\n  .mc-what-we-make .mc-category:first-child {\r\n    padding: 15px 0;\r\n    border-right: 0;\r\n    border-bottom: 1px solid #343B40;\r\n  }\r\n\r\n  .mc-what-we-make .mc-category:last-child {\r\n    border-bottom: 0;\r\n  }\r\n\r\n  .mc-what-we-make .mc-category-icon {\r\n    width: 42px;\r\n    height: 42px;\r\n    font-size: 23px;\r\n    margin: 10px 0;\r\n  }\r\n\r\n  .mc-what-we-make .mc-category h3 {\r\n    font-size: 19px;\r\n    margin-bottom: 5px !important;\r\n  }\r\n\r\n  .mc-what-we-make .mc-category p {\r\n    font-size: 12px;\r\n    line-height: 1.6;\r\n  }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  .mc-what-we-make *,\r\n  .mc-what-we-make *::before,\r\n  .mc-what-we-make *::after {\r\n    animation-duration: .01ms !important;\r\n    animation-iteration-count: 1 !important;\r\n    transition: none !important;\r\n  }\r\n\r\n  .mc-what-we-make.mc-wm-ready .mc-eyebrow,\r\n  .mc-what-we-make.mc-wm-ready h2,\r\n  .mc-what-we-make.mc-wm-ready .mc-intro,\r\n  .mc-what-we-make.mc-wm-ready .mc-category {\r\n    opacity: 1 !important;\r\n    transform: none !important;\r\n    filter: none !important;\r\n  }\r\n}\r\n\r\n\/* ==========================================================\r\n   PROFESSIONAL ENGINEERING \/ COMPUTER-SCIENCE VISUAL SYSTEM\r\n   Blueprint grid + circuit traces + restrained signal motion\r\n   ========================================================== *\/\r\n.mc-what-we-make {\r\n  isolation: isolate;\r\n  background: #070A0B !important;\r\n}\r\n.mc-what-we-make .mc-engineering-visual {\r\n  position: absolute;\r\n  inset: 0;\r\n  z-index: -1;\r\n  pointer-events: none;\r\n  overflow: hidden;\r\n  background:\r\n    radial-gradient(ellipse at 52% 0%, rgba(25,216,196,.075), transparent 52%),\r\n    linear-gradient(135deg, #070A0B 0%, #091013 48%, #070A0B 100%);\r\n}\r\n.mc-what-we-make .mc-engineering-grid {\r\n  position: absolute;\r\n  inset: -10%;\r\n  opacity: .26;\r\n  background-image:\r\n    linear-gradient(rgba(95,130,135,.12) 1px, transparent 1px),\r\n    linear-gradient(90deg, rgba(95,130,135,.12) 1px, transparent 1px);\r\n  background-size: 36px 36px;\r\n  mask-image: linear-gradient(180deg, transparent, #000 16%, #000 80%, transparent);\r\n  animation: mc-engineering-grid-move 28s linear infinite;\r\n}\r\n.mc-what-we-make .mc-engineering-circuit {\r\n  position: absolute;\r\n  inset: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  opacity: .52;\r\n}\r\n.mc-what-we-make .mc-circuit-path {\r\n  fill: none;\r\n  stroke: rgba(25,216,196,.24);\r\n  stroke-width: 1.2;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n  stroke-dasharray: 7 12;\r\n  animation: mc-circuit-flow 16s linear infinite;\r\n}\r\n.mc-what-we-make .mc-circuit-path-b {\r\n  stroke: rgba(240,160,76,.20);\r\n  stroke-dasharray: 4 15;\r\n  animation-duration: 21s;\r\n  animation-direction: reverse;\r\n}\r\n.mc-what-we-make .mc-circuit-path-c {\r\n  stroke: rgba(25,216,196,.16);\r\n  stroke-dasharray: 2 13;\r\n  animation-duration: 19s;\r\n}\r\n.mc-what-we-make .mc-circuit-node {\r\n  fill: #19D8C4;\r\n  stroke: rgba(25,216,196,.22);\r\n  stroke-width: 8;\r\n  transform-box: fill-box;\r\n  transform-origin: center;\r\n  animation: mc-circuit-node-pulse 3.8s ease-in-out infinite;\r\n}\r\n.mc-what-we-make .node-b { animation-delay: -.8s; }\r\n.mc-what-we-make .node-c { fill: #F0A04C; stroke: rgba(240,160,76,.18); animation-delay: -1.7s; }\r\n.mc-what-we-make .node-d { animation-delay: -2.4s; }\r\n.mc-what-we-make .node-e { fill: #F0A04C; stroke: rgba(240,160,76,.18); animation-delay: -1.2s; }\r\n.mc-what-we-make .mc-engineering-scan {\r\n  position: absolute;\r\n  left: 0;\r\n  right: 0;\r\n  top: -20%;\r\n  height: 18%;\r\n  background: linear-gradient(180deg, transparent, rgba(25,216,196,.045), transparent);\r\n  animation: mc-engineering-scan 11s ease-in-out infinite;\r\n}\r\n.mc-what-we-make > .mc-eyebrow,\r\n.mc-what-we-make > h2,\r\n.mc-what-we-make > .mc-intro,\r\n.mc-what-we-make > .mc-category-grid {\r\n  position: relative;\r\n  z-index: 1;\r\n}\r\n.mc-what-we-make .mc-category {\r\n  transition: background .35s ease, border-color .35s ease, transform .35s cubic-bezier(.2,.75,.25,1), box-shadow .35s ease;\r\n}\r\n.mc-what-we-make .mc-category:hover {\r\n  transform: translateY(-4px);\r\n  box-shadow: 0 16px 32px rgba(0,0,0,.22), inset 0 1px rgba(25,216,196,.10);\r\n}\r\n.mc-what-we-make .mc-category-icon {\r\n  transition: color .3s ease, border-color .3s ease, background .3s ease, transform .45s cubic-bezier(.2,.75,.25,1), box-shadow .3s ease;\r\n}\r\n.mc-what-we-make .mc-category:hover .mc-category-icon {\r\n  transform: translateY(-2px) scale(1.04);\r\n}\r\n@keyframes mc-engineering-grid-move {\r\n  from { transform: translate3d(0,0,0); }\r\n  to { transform: translate3d(36px,36px,0); }\r\n}\r\n@keyframes mc-circuit-flow {\r\n  to { stroke-dashoffset: -190; }\r\n}\r\n@keyframes mc-circuit-node-pulse {\r\n  0%, 100% { opacity: .52; transform: scale(.85); }\r\n  50% { opacity: 1; transform: scale(1.12); }\r\n}\r\n@keyframes mc-engineering-scan {\r\n  0% { transform: translateY(0); opacity: 0; }\r\n  15% { opacity: .75; }\r\n  85% { opacity: .55; }\r\n  100% { transform: translateY(720%); opacity: 0; }\r\n}\r\n@media (max-width: 600px) {\r\n  .mc-what-we-make .mc-engineering-circuit { opacity: .28; }\r\n  .mc-what-we-make .mc-engineering-grid { background-size: 28px 28px; }\r\n}\r\n@media (prefers-reduced-motion: reduce) {\r\n  .mc-what-we-make .mc-engineering-grid,\r\n  .mc-what-we-make .mc-circuit-path,\r\n  .mc-what-we-make .mc-circuit-node,\r\n  .mc-what-we-make .mc-engineering-scan {\r\n    animation: none !important;\r\n  }\r\n}\r\n\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  function initWhatWeMake() {\r\n    document.querySelectorAll('.mc-what-we-make').forEach(function (section) {\r\n      if (section.dataset.wmReady === 'true') return;\r\n      section.dataset.wmReady = 'true';\r\n      section.classList.add('mc-wm-ready');\r\n\r\n      if ('IntersectionObserver' in window) {\r\n        var observer = new IntersectionObserver(function (entries) {\r\n          entries.forEach(function (entry) {\r\n            if (entry.isIntersecting) {\r\n              section.classList.add('mc-wm-visible');\r\n              observer.unobserve(section);\r\n            }\r\n          });\r\n        }, { threshold: 0.12, rootMargin: '0px 0px -3% 0px' });\r\n        observer.observe(section);\r\n      } else {\r\n        section.classList.add('mc-wm-visible');\r\n      }\r\n    });\r\n  }\r\n\r\n  if (document.readyState === 'loading') {\r\n    document.addEventListener('DOMContentLoaded', initWhatWeMake, { once: true });\r\n  } else {\r\n    initWhatWeMake();\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-ad6b2e0 e-con-full e-flex e-con e-parent\" data-id=\"ad6b2e0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-79e2790 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"79e2790\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section class=\"mc-workshops\">\r\n  <div class=\"mc-workshop-heading\">\r\n    <div class=\"mc-workshop-title\">\r\n      <p class=\"mc-eyebrow\">LEARN BY DOING<\/p>\r\n      <h2>Make something <span>unexpected.<\/span><\/h2>\r\n    <\/div>\r\n\r\n    <p class=\"mc-workshop-intro\">\r\n      Learn new skills, experiment with tools and turn your ideas into real projects.\r\n      Explore digital making, electronics, fabrication and creative design with our maker community.\r\n    <\/p>\r\n  <\/div>\r\n\r\n  <div class=\"mc-workshop-grid\">\r\n\r\n    <article class=\"mc-workshop-card\">\r\n      <div class=\"mc-workshop-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-7.23.16-PM-scaled.webp\"\r\n             alt=\"Digital making and creative coding workshop\" loading=\"lazy\">\r\n        <span class=\"mc-workshop-image-label\">01 \/ DIGITAL<\/span>\r\n      <\/div>\r\n      <div class=\"mc-workshop-body\">\r\n        <span class=\"mc-workshop-category\">WORKSHOP \/ DIGITAL<\/span>\r\n        <h3>Creative Coding<\/h3>\r\n        <p>Turn code into art, interactive visuals and creative digital experiments. Explore how programming can bring ideas to life through animation, design and playful digital experiences.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <article class=\"mc-workshop-card\">\r\n      <div class=\"mc-workshop-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-11.33.02-AM.webp\"\r\n             alt=\"Hands-on electronics and prototyping workshop\" loading=\"lazy\">\r\n        <span class=\"mc-workshop-image-label\">02 \/ ELECTRONICS<\/span>\r\n      <\/div>\r\n      <div class=\"mc-workshop-body\">\r\n        <span class=\"mc-workshop-category\">WORKSHOP \/ ELECTRONICS<\/span>\r\n        <h3>Build with Electronics<\/h3>\r\n        <p>Experiment with circuits, sensors and electronic components to build useful inventions. Discover how hardware works together and develop practical skills through hands-on projects.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <article class=\"mc-workshop-card\">\r\n      <div class=\"mc-workshop-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/WhatsApp-Image-2026-08-24-at-7.23.15-PM.webp\"\r\n             alt=\"3D printing and digital fabrication workshop\" loading=\"lazy\">\r\n        <span class=\"mc-workshop-image-label\">03 \/ FABRICATION<\/span>\r\n      <\/div>\r\n      <div class=\"mc-workshop-body\">\r\n        <span class=\"mc-workshop-category\">WORKSHOP \/ FABRICATION<\/span>\r\n        <h3>3D Printing &amp; Making<\/h3>\r\n        <p>Transform digital designs into physical objects using 3D modelling and rapid prototyping. Explore materials, test your ideas and learn how digital fabrication can solve practical challenges.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n    <article class=\"mc-workshop-card\">\r\n      <div class=\"mc-workshop-image\">\r\n        <img decoding=\"async\" src=\"https:\/\/cdtmaker.club\/wp-content\/uploads\/2026\/10\/PXL_20260803_113501058.MP_-scaled.webp\"\r\n             alt=\"Creative product design and prototyping workshop\" loading=\"lazy\">\r\n        <span class=\"mc-workshop-image-label\">04 \/ DESIGN<\/span>\r\n      <\/div>\r\n      <div class=\"mc-workshop-body\">\r\n        <span class=\"mc-workshop-category\">WORKSHOP \/ DESIGN<\/span>\r\n        <h3>Design &amp; Prototype<\/h3>\r\n        <p>Sketch ideas, explore different materials and test creative concepts. Learn how to improve designs through prototyping and develop user-focused solutions to real-world problems.<\/p>\r\n      <\/div>\r\n    <\/article>\r\n\r\n  <\/div>\r\n\r\n  <div class=\"mc-workshop-footer\">\r\n    <span class=\"mc-footer-line\"><\/span>\r\n    <p>THINK IT. MAKE IT. SHARE IT.<\/p>\r\n    <span class=\"mc-footer-line\"><\/span>\r\n  <\/div>\r\n<\/section>\r\n\r\n<style>\r\n.mc-workshops,\r\n.mc-workshops * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.mc-workshops {\r\n  width: 100%;\r\n  margin: 0 !important;\r\n  padding: 28px 2.5% !important;\r\n  background: #070A0B;\r\n  color: #F5F3F5;\r\n  font-family: 'Inter', Arial, sans-serif;\r\n  overflow: hidden;\r\n  position: relative;\r\n  isolation: isolate;\r\n}\r\n\r\n.mc-workshops::before,\r\n.mc-workshops::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  z-index: -1;\r\n  pointer-events: none;\r\n}\r\n\r\n.mc-workshops::before {\r\n  inset: -35% -20%;\r\n  background:\r\n    radial-gradient(ellipse at 15% 18%, rgba(25,216,196,.105), transparent 34%),\r\n    radial-gradient(ellipse at 85% 80%, rgba(240,160,76,.04), transparent 32%);\r\n  opacity: 0;\r\n  animation: mc-ws-ambient 1.8s ease-out .1s forwards, mc-ws-drift 18s ease-in-out 2s infinite alternate;\r\n}\r\n\r\n.mc-workshops::after {\r\n  top: -20%;\r\n  bottom: -20%;\r\n  left: -42%;\r\n  width: 25%;\r\n  transform: skewX(-18deg);\r\n  background: linear-gradient(90deg, transparent, rgba(25,216,196,.055), rgba(255,255,255,.025), transparent);\r\n  animation: mc-ws-light-sweep 10s ease-in-out 1.5s infinite;\r\n}\r\n\r\n.mc-workshops .mc-workshop-heading {\r\n  display: grid;\r\n  grid-template-columns: 1fr 0.8fr;\r\n  align-items: end;\r\n  gap: 24px;\r\n  margin: 0 0 20px;\r\n  position: relative;\r\n}\r\n\r\n.mc-workshops .mc-workshop-title,\r\n.mc-workshops .mc-workshop-intro {\r\n  opacity: 0;\r\n  transform: translateY(20px);\r\n}\r\n\r\n.mc-workshops .mc-eyebrow {\r\n  color: #19D8C4;\r\n  font-size: 10px;\r\n  font-weight: 800;\r\n  letter-spacing: 2px;\r\n  line-height: 1.5;\r\n  margin: 0 0 8px;\r\n  width: fit-content;\r\n  position: relative;\r\n}\r\n\r\n.mc-workshops .mc-eyebrow::after {\r\n  content: \"\";\r\n  display: block;\r\n  width: 0;\r\n  height: 1px;\r\n  margin-top: 5px;\r\n  background: #19D8C4;\r\n  box-shadow: 0 0 10px rgba(25,216,196,.55);\r\n}\r\n\r\n.mc-workshops .mc-workshop-heading h2 {\r\n  color: #F5F3F5;\r\n  font-family: 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  font-size: clamp(25px, 3vw, 38px);\r\n  font-weight: 800;\r\n  letter-spacing: -1px;\r\n  line-height: 1.15;\r\n  margin: 0;\r\n}\r\n\r\n.mc-workshops .mc-workshop-heading h2 span {\r\n  color: #19D8C4;\r\n  display: inline-block;\r\n  transform-origin: left center;\r\n}\r\n\r\n.mc-workshops .mc-workshop-intro {\r\n  max-width: 560px;\r\n  justify-self: end;\r\n  color: #AEB8BD;\r\n  font-size: 12px;\r\n  line-height: 1.7;\r\n  margin: 0;\r\n}\r\n\r\n.mc-workshops .mc-workshop-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(4, minmax(0, 1fr));\r\n  gap: 12px;\r\n  width: 100%;\r\n  margin: 0;\r\n  padding: 0;\r\n  perspective: 1400px;\r\n}\r\n\r\n.mc-workshops .mc-workshop-card {\r\n  display: flex;\r\n  flex-direction: column;\r\n  min-width: 0;\r\n  background: #15191D;\r\n  border: 1px solid #343B40;\r\n  border-radius: 8px;\r\n  overflow: hidden;\r\n  position: relative;\r\n  isolation: isolate;\r\n  opacity: 0;\r\n  transform: translateY(34px) rotateX(5deg) scale(.98);\r\n  transform-origin: center bottom;\r\n  transition:\r\n    border-color .45s ease,\r\n    transform .7s cubic-bezier(.2,.75,.25,1),\r\n    box-shadow .5s ease,\r\n    background .45s ease;\r\n}\r\n\r\n.mc-workshops .mc-workshop-card::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  z-index: 3;\r\n  top: -20%;\r\n  bottom: -20%;\r\n  left: -120%;\r\n  width: 70%;\r\n  pointer-events: none;\r\n  transform: skewX(-18deg);\r\n  background: linear-gradient(90deg, transparent, rgba(255,255,255,.11), rgba(25,216,196,.10), transparent);\r\n}\r\n\r\n.mc-workshops .mc-workshop-card::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  z-index: 2;\r\n  inset: 0;\r\n  border-radius: inherit;\r\n  pointer-events: none;\r\n  border: 1px solid rgba(25,216,196,0);\r\n  transition: border-color .4s ease, box-shadow .4s ease;\r\n}\r\n\r\n.mc-workshops .mc-workshop-card:hover {\r\n  border-color: #19D8C4;\r\n  background: #171D20;\r\n  transform: translateY(-7px) rotateX(0) scale(1.012);\r\n  box-shadow: 0 18px 42px rgba(0,0,0,.32), 0 0 24px rgba(25,216,196,.075);\r\n}\r\n\r\n.mc-workshops .mc-workshop-card:hover::before {\r\n  animation: mc-ws-card-sheen 1.05s ease forwards;\r\n}\r\n\r\n.mc-workshops .mc-workshop-card:hover::after {\r\n  border-color: rgba(25,216,196,.28);\r\n  box-shadow: inset 0 0 18px rgba(25,216,196,.035);\r\n}\r\n\r\n.mc-workshops .mc-workshop-image {\r\n  position: relative;\r\n  width: 100%;\r\n  aspect-ratio: 1.45 \/ 1;\r\n  overflow: hidden;\r\n  background: #15191D;\r\n  isolation: isolate;\r\n}\r\n\r\n.mc-workshops .mc-workshop-image::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  inset: 0;\r\n  z-index: 1;\r\n  pointer-events: none;\r\n  background: linear-gradient(180deg, rgba(7,10,11,.02) 35%, rgba(7,10,11,.65) 100%);\r\n  opacity: .7;\r\n  transition: opacity .55s ease;\r\n}\r\n\r\n.mc-workshops .mc-workshop-image::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  z-index: 2;\r\n  bottom: 0;\r\n  left: 0;\r\n  height: 2px;\r\n  width: 100%;\r\n  background: #19D8C4;\r\n  box-shadow: 0 0 14px rgba(25,216,196,.6);\r\n  transform: scaleX(0);\r\n  transform-origin: left;\r\n  transition: transform .65s cubic-bezier(.2,.75,.25,1);\r\n}\r\n\r\n.mc-workshops .mc-workshop-image img {\r\n  display: block;\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  object-position: center;\r\n  margin: 0;\r\n  transform: scale(1.07);\r\n  filter: saturate(.86) contrast(1.03);\r\n  transition: transform 1.2s cubic-bezier(.2,.75,.25,1), filter .7s ease;\r\n}\r\n\r\n.mc-workshops .mc-workshop-card:hover .mc-workshop-image img {\r\n  transform: scale(1.16);\r\n  filter: saturate(1.12) contrast(1.05);\r\n}\r\n\r\n.mc-workshops .mc-workshop-card:hover .mc-workshop-image::before { opacity: .38; }\r\n.mc-workshops .mc-workshop-card:hover .mc-workshop-image::after { transform: scaleX(1); }\r\n\r\n.mc-workshops .mc-workshop-image-label {\r\n  position: absolute;\r\n  z-index: 2;\r\n  left: 8px;\r\n  bottom: 8px;\r\n  max-width: calc(100% - 16px);\r\n  padding: 5px 7px;\r\n  background: #070A0B;\r\n  color: #19D8C4;\r\n  border: 1px solid #343B40;\r\n  border-radius: 3px;\r\n  font-size: 8px;\r\n  font-weight: 800;\r\n  letter-spacing: 0.7px;\r\n  transition: border-color .4s ease, transform .4s ease;\r\n}\r\n\r\n.mc-workshops .mc-workshop-card:hover .mc-workshop-image-label {\r\n  border-color: #19D8C4;\r\n  transform: translateY(-2px);\r\n}\r\n\r\n.mc-workshops .mc-workshop-body {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  flex: 1;\r\n  padding: 13px;\r\n  position: relative;\r\n  z-index: 1;\r\n}\r\n\r\n.mc-workshops .mc-workshop-category {\r\n  display: block;\r\n  color: #19D8C4;\r\n  font-size: 8px;\r\n  font-weight: 800;\r\n  letter-spacing: 0.8px;\r\n  line-height: 1.6;\r\n  overflow-wrap: anywhere;\r\n  transition: letter-spacing .4s ease;\r\n}\r\n\r\n.mc-workshops .mc-workshop-card:hover .mc-workshop-category {\r\n  letter-spacing: 1.1px;\r\n}\r\n\r\n.mc-workshops .mc-workshop-body h3 {\r\n  color: #F5F3F5;\r\n  font-family: 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  font-size: clamp(14px, 1.35vw, 18px);\r\n  font-weight: 700;\r\n  line-height: 1.3;\r\n  margin: 7px 0;\r\n  overflow-wrap: anywhere;\r\n  transition: transform .4s ease, color .4s ease;\r\n}\r\n\r\n.mc-workshops .mc-workshop-card:hover .mc-workshop-body h3 {\r\n  transform: translateX(3px);\r\n  color: #FFFFFF;\r\n}\r\n\r\n.mc-workshops .mc-workshop-body p {\r\n  color: #AEB8BD;\r\n  font-size: 11px;\r\n  line-height: 1.65;\r\n  margin: 0;\r\n  overflow-wrap: anywhere;\r\n  transition: color .4s ease;\r\n}\r\n\r\n.mc-workshops .mc-workshop-card:hover .mc-workshop-body p {\r\n  color: #D0D8DB;\r\n}\r\n\r\n.mc-workshops .mc-workshop-footer {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 12px;\r\n  margin-top: 17px;\r\n  opacity: 0;\r\n  transform: translateY(10px);\r\n}\r\n\r\n.mc-workshops .mc-workshop-footer p {\r\n  flex-shrink: 0;\r\n  color: #F0A04C;\r\n  font-size: 9px;\r\n  font-weight: 800;\r\n  letter-spacing: 2px;\r\n  margin: 0;\r\n}\r\n\r\n.mc-workshops .mc-footer-line {\r\n  width: 55px;\r\n  height: 1px;\r\n  background: #343B40;\r\n  transform: scaleX(0);\r\n  transition: transform .8s ease;\r\n}\r\n\r\n\/* Scroll-triggered entrance *\/\r\n.mc-workshops.mc-ws-ready .mc-workshop-title,\r\n.mc-workshops.mc-ws-ready .mc-workshop-intro,\r\n.mc-workshops.mc-ws-ready .mc-workshop-card,\r\n.mc-workshops.mc-ws-ready .mc-workshop-footer {\r\n  animation: none;\r\n}\r\n\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-workshop-title {\r\n  animation: mc-ws-heading-reveal .95s cubic-bezier(.16,1,.3,1) .08s forwards;\r\n}\r\n\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-eyebrow::after {\r\n  animation: mc-ws-underline .75s cubic-bezier(.2,.75,.25,1) .65s forwards;\r\n}\r\n\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-workshop-heading h2 span {\r\n  animation: mc-ws-text-glow 3.8s ease-in-out 1.5s infinite;\r\n}\r\n\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-workshop-intro {\r\n  animation: mc-ws-heading-reveal .9s cubic-bezier(.16,1,.3,1) .28s forwards;\r\n}\r\n\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-workshop-card {\r\n  animation: mc-ws-card-reveal 1s cubic-bezier(.16,1,.3,1) forwards;\r\n}\r\n\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-workshop-card:nth-child(1) { animation-delay: .22s; }\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-workshop-card:nth-child(2) { animation-delay: .38s; }\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-workshop-card:nth-child(3) { animation-delay: .54s; }\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-workshop-card:nth-child(4) { animation-delay: .70s; }\r\n\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-workshop-footer {\r\n  animation: mc-ws-heading-reveal .8s cubic-bezier(.16,1,.3,1) 1.05s forwards;\r\n}\r\n\r\n.mc-workshops.mc-ws-ready.mc-ws-visible .mc-footer-line {\r\n  transform: scaleX(1);\r\n}\r\n\r\n@keyframes mc-ws-ambient { to { opacity: 1; } }\r\n@keyframes mc-ws-drift {\r\n  from { transform: translate3d(-1%, -1%, 0) scale(1); }\r\n  to { transform: translate3d(1%, 1%, 0) scale(1.06); }\r\n}\r\n@keyframes mc-ws-light-sweep {\r\n  0%, 10% { left: -42%; opacity: 0; }\r\n  18% { opacity: 1; }\r\n  45% { left: 125%; opacity: .75; }\r\n  46%, 100% { left: 125%; opacity: 0; }\r\n}\r\n@keyframes mc-ws-heading-reveal {\r\n  from { opacity: 0; transform: translateY(22px); filter: blur(5px); }\r\n  70% { filter: blur(0); }\r\n  to { opacity: 1; transform: translateY(0); filter: blur(0); }\r\n}\r\n@keyframes mc-ws-underline { to { width: 100%; } }\r\n@keyframes mc-ws-text-glow {\r\n  0%, 100% { text-shadow: 0 0 0 rgba(25,216,196,0); }\r\n  50% { text-shadow: 0 0 22px rgba(25,216,196,.24); }\r\n}\r\n@keyframes mc-ws-card-reveal {\r\n  0% { opacity: 0; transform: translateY(36px) rotateX(6deg) scale(.975); filter: blur(5px); }\r\n  70% { filter: blur(0); }\r\n  100% { opacity: 1; transform: translateY(0) rotateX(0) scale(1); filter: blur(0); }\r\n}\r\n@keyframes mc-ws-card-sheen {\r\n  from { left: -120%; }\r\n  to { left: 150%; }\r\n}\r\n\r\n\/* Tablet *\/\r\n@media (min-width: 601px) and (max-width: 1024px) {\r\n  .mc-workshops {\r\n    padding: 25px 2% !important;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-grid {\r\n    gap: 8px;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-body {\r\n    padding: 10px;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-body h3 {\r\n    font-size: 14px;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-body p {\r\n    font-size: 10px;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-category {\r\n    font-size: 7px;\r\n  }\r\n}\r\n\r\n\/* Mobile: one horizontally scrollable row *\/\r\n@media (max-width: 600px) {\r\n  .mc-workshops {\r\n    padding: 22px 12px !important;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-heading {\r\n    grid-template-columns: 1fr;\r\n    gap: 10px;\r\n    margin-bottom: 16px;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-heading h2 {\r\n    font-size: 29px;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-intro {\r\n    justify-self: start;\r\n    font-size: 12px;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(4, 210px);\r\n    gap: 10px;\r\n    overflow-x: auto;\r\n    padding: 0 0 8px;\r\n    scrollbar-width: thin;\r\n    scroll-snap-type: x mandatory;\r\n    -webkit-overflow-scrolling: touch;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-card {\r\n    scroll-snap-align: start;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-image {\r\n    aspect-ratio: 1.4 \/ 1;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-body {\r\n    padding: 12px;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-body h3 {\r\n    font-size: 16px;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-body p {\r\n    font-size: 11px;\r\n  }\r\n\r\n  .mc-workshops .mc-workshop-footer {\r\n    margin-top: 13px;\r\n  }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  .mc-workshops *,\r\n  .mc-workshops *::before,\r\n  .mc-workshops *::after {\r\n    animation-duration: .01ms !important;\r\n    animation-iteration-count: 1 !important;\r\n    transition: none !important;\r\n  }\r\n\r\n  .mc-workshops.mc-ws-ready .mc-workshop-title,\r\n  .mc-workshops.mc-ws-ready .mc-workshop-intro,\r\n  .mc-workshops.mc-ws-ready .mc-workshop-card,\r\n  .mc-workshops.mc-ws-ready .mc-workshop-footer {\r\n    opacity: 1 !important;\r\n    transform: none !important;\r\n    filter: none !important;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  function initWorkshops() {\r\n    document.querySelectorAll('.mc-workshops').forEach(function (section) {\r\n      if (section.dataset.wsReady === 'true') return;\r\n      section.dataset.wsReady = 'true';\r\n      section.classList.add('mc-ws-ready');\r\n\r\n      if ('IntersectionObserver' in window) {\r\n        var observer = new IntersectionObserver(function (entries) {\r\n          entries.forEach(function (entry) {\r\n            if (entry.isIntersecting) {\r\n              section.classList.add('mc-ws-visible');\r\n              observer.unobserve(section);\r\n            }\r\n          });\r\n        }, { threshold: 0.1, rootMargin: '0px 0px -3% 0px' });\r\n        observer.observe(section);\r\n      } else {\r\n        section.classList.add('mc-ws-visible');\r\n      }\r\n    });\r\n  }\r\n\r\n  if (document.readyState === 'loading') {\r\n    document.addEventListener('DOMContentLoaded', initWorkshops, { once: true });\r\n  } else {\r\n    initWorkshops();\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d222434 e-con-full e-flex e-con e-parent\" data-id=\"d222434\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d28cf73 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"d28cf73\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- CDT MAKER CLUB \u2014 CINEMATIC GET INVOLVED SECTION -->\r\n<section class=\"mc-get-involved\" id=\"get-involved\">\r\n\r\n  <div class=\"mc-join-content\">\r\n    <p class=\"mc-eyebrow\">YOUR IDEA STARTS HERE<\/p>\r\n\r\n    <h2>Curious minds.<br><span>Creative hands.<\/span><\/h2>\r\n\r\n    <p class=\"mc-join-description\">\r\n      You don't need to be an expert to get started. Bring your curiosity,\r\n      meet other makers and discover what you can create. Explore new tools,\r\n      share ideas and turn your imagination into something real.\r\n    <\/p>\r\n\r\n    <div class=\"mc-join-buttons\">\r\n      <span class=\"mc-join-primary mc-join-static\">GET INVOLVED \u2197<\/span>\r\n      <span class=\"mc-join-secondary mc-join-static\">ABOUT THE CLUB \u2192<\/span>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"mc-join-mark\" aria-hidden=\"true\">\r\n    MAKE<br>IT<br><span>REAL.<\/span>\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<style>\r\n.mc-get-involved,\r\n.mc-get-involved * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.mc-get-involved {\r\n  width: 100%;\r\n  margin: 0 !important;\r\n  padding: 28px 3% !important;\r\n  display: grid;\r\n  grid-template-columns: 1.2fr 0.8fr;\r\n  align-items: center;\r\n  gap: 24px;\r\n  overflow: hidden;\r\n  position: relative;\r\n  isolation: isolate;\r\n  background: #070A0B;\r\n  color: #F5F3F5;\r\n  font-family: 'Inter', Arial, sans-serif;\r\n  border-top: 1px solid #343B40;\r\n}\r\n\r\n.mc-get-involved::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  z-index: -1;\r\n  inset: -45% -20%;\r\n  pointer-events: none;\r\n  opacity: 0;\r\n  background:\r\n    radial-gradient(ellipse at 18% 35%, rgba(25,216,196,.12), transparent 36%),\r\n    radial-gradient(ellipse at 82% 65%, rgba(240,160,76,.055), transparent 31%);\r\n  animation: mc-gi-atmosphere 1.6s ease-out .1s forwards, mc-gi-drift 15s ease-in-out 1.7s infinite alternate;\r\n}\r\n\r\n.mc-get-involved::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  z-index: -1;\r\n  top: -30%;\r\n  bottom: -30%;\r\n  left: -40%;\r\n  width: 28%;\r\n  pointer-events: none;\r\n  transform: skewX(-20deg);\r\n  background: linear-gradient(90deg, transparent, rgba(25,216,196,.06), rgba(255,255,255,.025), transparent);\r\n  animation: mc-gi-light-sweep 9s ease-in-out 1.5s infinite;\r\n}\r\n\r\n.mc-get-involved .mc-join-content {\r\n  min-width: 0;\r\n  max-width: 760px;\r\n  opacity: 0;\r\n  transform: translateY(22px);\r\n}\r\n\r\n.mc-get-involved .mc-eyebrow {\r\n  color: #19D8C4;\r\n  font-size: 10px;\r\n  font-weight: 800;\r\n  letter-spacing: 2px;\r\n  line-height: 1.5;\r\n  margin: 0 0 9px;\r\n  position: relative;\r\n  width: fit-content;\r\n}\r\n\r\n.mc-get-involved .mc-eyebrow::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  left: 0;\r\n  bottom: -5px;\r\n  width: 0;\r\n  height: 1px;\r\n  background: #19D8C4;\r\n  box-shadow: 0 0 10px rgba(25,216,196,.6);\r\n}\r\n\r\n.mc-get-involved h2 {\r\n  color: #F5F3F5;\r\n  font-family: 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  font-size: clamp(30px, 3.8vw, 48px);\r\n  font-weight: 800;\r\n  letter-spacing: -1.2px;\r\n  line-height: 1.1;\r\n  margin: 0 0 12px;\r\n}\r\n\r\n.mc-get-involved h2 span {\r\n  color: #19D8C4;\r\n  display: inline-block;\r\n  transform-origin: left center;\r\n}\r\n\r\n.mc-get-involved .mc-join-description {\r\n  max-width: 620px;\r\n  color: #AEB8BD;\r\n  font-size: 13px;\r\n  line-height: 1.7;\r\n  margin: 0;\r\n  opacity: 0;\r\n  transform: translateY(14px);\r\n}\r\n\r\n.mc-get-involved .mc-join-buttons {\r\n  display: flex;\r\n  flex-wrap: wrap;\r\n  align-items: center;\r\n  gap: 10px;\r\n  margin-top: 17px;\r\n  opacity: 0;\r\n  transform: translateY(12px);\r\n}\r\n\r\n.mc-get-involved .mc-join-primary,\r\n.mc-get-involved .mc-join-secondary {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  min-height: 38px;\r\n  padding: 10px 15px;\r\n  border-radius: 6px;\r\n  text-decoration: none;\r\n  font-size: 10px;\r\n  font-weight: 800;\r\n  letter-spacing: 0.6px;\r\n  cursor: default;\r\n  user-select: none;\r\n  position: relative;\r\n  overflow: hidden;\r\n  transition: transform .4s cubic-bezier(.2,.75,.25,1), box-shadow .4s ease, border-color .4s ease, background .4s ease;\r\n}\r\n\r\n.mc-get-involved .mc-join-primary::after,\r\n.mc-get-involved .mc-join-secondary::after {\r\n  content: \"\";\r\n  position: absolute;\r\n  top: -80%;\r\n  bottom: -80%;\r\n  left: -120%;\r\n  width: 70%;\r\n  pointer-events: none;\r\n  transform: skewX(-20deg);\r\n  background: linear-gradient(90deg, transparent, rgba(255,255,255,.4), transparent);\r\n}\r\n\r\n.mc-get-involved .mc-join-primary {\r\n  background: #19D8C4;\r\n  color: #070A0B;\r\n  border: 1px solid #19D8C4;\r\n}\r\n\r\n.mc-get-involved .mc-join-secondary {\r\n  background: transparent;\r\n  color: #F5F3F5;\r\n  border: 1px solid #343B40;\r\n}\r\n\r\n.mc-get-involved .mc-join-primary:hover,\r\n.mc-get-involved .mc-join-secondary:hover {\r\n  transform: translateY(-3px);\r\n  box-shadow: 0 9px 24px rgba(0,0,0,.22);\r\n}\r\n\r\n.mc-get-involved .mc-join-primary:hover::after,\r\n.mc-get-involved .mc-join-secondary:hover::after {\r\n  animation: mc-gi-button-sheen .85s ease forwards;\r\n}\r\n\r\n.mc-get-involved .mc-join-secondary:hover {\r\n  border-color: #19D8C4;\r\n}\r\n\r\n.mc-get-involved .mc-join-mark {\r\n  min-width: 0;\r\n  color: #F5F3F5;\r\n  font-family: 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  font-size: clamp(54px, 8vw, 100px);\r\n  font-weight: 800;\r\n  letter-spacing: -3px;\r\n  line-height: 0.88;\r\n  text-align: right;\r\n  overflow-wrap: normal;\r\n  opacity: 0;\r\n  transform: translateX(28px) scale(.96);\r\n  transform-origin: center right;\r\n  text-shadow: 0 0 0 rgba(25,216,196,0);\r\n  position: relative;\r\n}\r\n\r\n.mc-get-involved .mc-join-mark span {\r\n  color: #F0A04C;\r\n  display: inline-block;\r\n}\r\n\r\n.mc-get-involved .mc-join-mark::before {\r\n  content: \"\";\r\n  position: absolute;\r\n  z-index: -1;\r\n  inset: -12% -8%;\r\n  background: radial-gradient(ellipse, rgba(25,216,196,.09), transparent 68%);\r\n  opacity: 0;\r\n  transition: opacity .6s ease;\r\n}\r\n\r\n.mc-get-involved .mc-join-mark:hover::before {\r\n  opacity: 1;\r\n}\r\n\r\n\/* Scroll-triggered animation *\/\r\n.mc-get-involved.mc-gi-ready .mc-join-content,\r\n.mc-get-involved.mc-gi-ready .mc-join-description,\r\n.mc-get-involved.mc-gi-ready .mc-join-buttons,\r\n.mc-get-involved.mc-gi-ready .mc-join-mark {\r\n  animation: none;\r\n}\r\n\r\n.mc-get-involved.mc-gi-ready.mc-gi-visible .mc-join-content {\r\n  animation: mc-gi-content-reveal .95s cubic-bezier(.16,1,.3,1) .08s forwards;\r\n}\r\n\r\n.mc-get-involved.mc-gi-ready.mc-gi-visible .mc-eyebrow::after {\r\n  animation: mc-gi-underline .75s cubic-bezier(.2,.75,.25,1) .55s forwards;\r\n}\r\n\r\n.mc-get-involved.mc-gi-ready.mc-gi-visible h2 span {\r\n  animation: mc-gi-text-glow 4s ease-in-out 1.3s infinite;\r\n}\r\n\r\n.mc-get-involved.mc-gi-ready.mc-gi-visible .mc-join-description {\r\n  animation: mc-gi-content-reveal .8s cubic-bezier(.16,1,.3,1) .32s forwards;\r\n}\r\n\r\n.mc-get-involved.mc-gi-ready.mc-gi-visible .mc-join-buttons {\r\n  animation: mc-gi-content-reveal .8s cubic-bezier(.16,1,.3,1) .48s forwards;\r\n}\r\n\r\n.mc-get-involved.mc-gi-ready.mc-gi-visible .mc-join-mark {\r\n  animation: mc-gi-mark-reveal 1.2s cubic-bezier(.16,1,.3,1) .24s forwards, mc-gi-mark-float 6s ease-in-out 1.7s infinite;\r\n}\r\n\r\n@keyframes mc-gi-atmosphere { to { opacity: 1; } }\r\n@keyframes mc-gi-drift {\r\n  from { transform: translate3d(-1%, -1%, 0) scale(1); }\r\n  to { transform: translate3d(1%, 1%, 0) scale(1.06); }\r\n}\r\n@keyframes mc-gi-light-sweep {\r\n  0%, 10% { left: -40%; opacity: 0; }\r\n  18% { opacity: 1; }\r\n  46% { left: 125%; opacity: .8; }\r\n  47%, 100% { left: 125%; opacity: 0; }\r\n}\r\n@keyframes mc-gi-content-reveal {\r\n  0% { opacity: 0; transform: translateY(22px); filter: blur(5px); }\r\n  70% { filter: blur(0); }\r\n  100% { opacity: 1; transform: translateY(0); filter: blur(0); }\r\n}\r\n@keyframes mc-gi-underline { to { width: 100%; } }\r\n@keyframes mc-gi-text-glow {\r\n  0%, 100% { text-shadow: 0 0 0 rgba(25,216,196,0); }\r\n  50% { text-shadow: 0 0 22px rgba(25,216,196,.24); }\r\n}\r\n@keyframes mc-gi-mark-reveal {\r\n  0% { opacity: 0; transform: translateX(36px) scale(.94); filter: blur(8px); }\r\n  70% { filter: blur(0); }\r\n  100% { opacity: 1; transform: translateX(0) scale(1); filter: blur(0); }\r\n}\r\n@keyframes mc-gi-mark-float {\r\n  0%, 100% { transform: translateY(0); }\r\n  50% { transform: translateY(-5px); }\r\n}\r\n@keyframes mc-gi-button-sheen {\r\n  from { left: -120%; }\r\n  to { left: 150%; }\r\n}\r\n\r\n\/* Tablet *\/\r\n@media (max-width: 1024px) {\r\n  .mc-get-involved {\r\n    padding: 25px 3% !important;\r\n    grid-template-columns: 1.2fr 0.8fr;\r\n    gap: 18px;\r\n  }\r\n\r\n  .mc-get-involved h2 {\r\n    font-size: clamp(28px, 4vw, 40px);\r\n  }\r\n\r\n  .mc-get-involved .mc-join-mark {\r\n    font-size: clamp(50px, 8vw, 78px);\r\n    letter-spacing: -2px;\r\n  }\r\n}\r\n\r\n\/* Mobile *\/\r\n@media (max-width: 600px) {\r\n  .mc-get-involved {\r\n    padding: 23px 5% !important;\r\n    grid-template-columns: 1fr;\r\n    gap: 22px;\r\n  }\r\n\r\n  .mc-get-involved h2 {\r\n    font-size: clamp(30px, 8vw, 40px);\r\n    letter-spacing: -0.7px;\r\n  }\r\n\r\n  .mc-get-involved .mc-join-description {\r\n    font-size: 12px;\r\n    line-height: 1.7;\r\n  }\r\n\r\n  .mc-get-involved .mc-join-buttons {\r\n    gap: 8px;\r\n    margin-top: 14px;\r\n  }\r\n\r\n  .mc-get-involved .mc-join-primary,\r\n  .mc-get-involved .mc-join-secondary {\r\n    min-height: 36px;\r\n    padding: 9px 11px;\r\n    font-size: 9px;\r\n  }\r\n\r\n  .mc-get-involved .mc-join-mark {\r\n    font-size: 55px;\r\n    line-height: 0.9;\r\n    text-align: left;\r\n    letter-spacing: -2px;\r\n  }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  .mc-get-involved *,\r\n  .mc-get-involved *::before,\r\n  .mc-get-involved *::after {\r\n    animation-duration: .01ms !important;\r\n    animation-iteration-count: 1 !important;\r\n    transition: none !important;\r\n  }\r\n\r\n  .mc-get-involved.mc-gi-ready .mc-join-content,\r\n  .mc-get-involved.mc-gi-ready .mc-join-description,\r\n  .mc-get-involved.mc-gi-ready .mc-join-buttons,\r\n  .mc-get-involved.mc-gi-ready .mc-join-mark {\r\n    opacity: 1 !important;\r\n    transform: none !important;\r\n    filter: none !important;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  function initGetInvolved() {\r\n    document.querySelectorAll('.mc-get-involved').forEach(function (section) {\r\n      if (section.dataset.giReady === 'true') return;\r\n      section.dataset.giReady = 'true';\r\n      section.classList.add('mc-gi-ready');\r\n\r\n      if ('IntersectionObserver' in window) {\r\n        var observer = new IntersectionObserver(function (entries) {\r\n          entries.forEach(function (entry) {\r\n            if (entry.isIntersecting) {\r\n              section.classList.add('mc-gi-visible');\r\n              observer.unobserve(section);\r\n            }\r\n          });\r\n        }, { threshold: 0.15, rootMargin: '0px 0px -3% 0px' });\r\n        observer.observe(section);\r\n      } else {\r\n        section.classList.add('mc-gi-visible');\r\n      }\r\n    });\r\n  }\r\n\r\n  if (document.readyState === 'loading') {\r\n    document.addEventListener('DOMContentLoaded', initGetInvolved, { once: true });\r\n  } else {\r\n    initGetInvolved();\r\n  }\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-c8eb3e1 e-con-full e-flex e-con e-parent\" data-id=\"c8eb3e1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-57ff17a elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"57ff17a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- CDT MAKER CLUB \u2014 COMPACT PARTNERS SECTION -->\r\n<section class=\"mc-partners\">\r\n\r\n  <div class=\"mc-partners-heading\">\r\n    <div>\r\n      <p class=\"mc-eyebrow\">BETTER THINGS, TOGETHER<\/p>\r\n      <h2>Made possible by <span>our community.<\/span><\/h2>\r\n    <\/div>\r\n\r\n    <p class=\"mc-partners-intro\">\r\n      We connect ideas, people, tools and expertise to make creative projects happen.\r\n      Our community brings together different skills, shared knowledge and a passion\r\n      for turning imaginative ideas into real-world creations.\r\n    <\/p>\r\n  <\/div>\r\n\r\n  <div class=\"mc-partner-list\">\r\n\r\n    <article class=\"mc-partner-placeholder\">\r\n      <span class=\"mc-partner-number\">01 \/ EDUCATION<\/span>\r\n      <div class=\"mc-partner-icon\" aria-hidden=\"true\">\u2302<\/div>\r\n      <h3 class=\"mc-partner-label\">University \/ Partner<\/h3>\r\n      <p class=\"mc-partner-description\">\r\n        Supporting learning, experimentation and opportunities to explore new technologies.\r\n      <\/p>\r\n      <span class=\"mc-partner-symbol\" aria-hidden=\"true\">\u2197<\/span>\r\n    <\/article>\r\n\r\n    <article class=\"mc-partner-placeholder\">\r\n      <span class=\"mc-partner-number\">02 \/ COMMUNITY<\/span>\r\n      <div class=\"mc-partner-icon\" aria-hidden=\"true\">\u25ce<\/div>\r\n      <h3 class=\"mc-partner-label\">Maker Community<\/h3>\r\n      <p class=\"mc-partner-description\">\r\n        Bringing curious minds together to exchange ideas, share skills and create collaboratively.\r\n      <\/p>\r\n      <span class=\"mc-partner-symbol\" aria-hidden=\"true\">\u2197<\/span>\r\n    <\/article>\r\n\r\n    <article class=\"mc-partner-placeholder\">\r\n      <span class=\"mc-partner-number\">03 \/ COLLABORATION<\/span>\r\n      <div class=\"mc-partner-icon\" aria-hidden=\"true\">\u25c7<\/div>\r\n      <h3 class=\"mc-partner-label\">Project Partners<\/h3>\r\n      <p class=\"mc-partner-description\">\r\n        Helping makers explore challenges, develop concepts and build practical prototypes.\r\n      <\/p>\r\n      <span class=\"mc-partner-symbol\" aria-hidden=\"true\">\u2197<\/span>\r\n    <\/article>\r\n\r\n    <article class=\"mc-partner-placeholder\">\r\n      <span class=\"mc-partner-number\">04 \/ SUPPORT<\/span>\r\n      <div class=\"mc-partner-icon\" aria-hidden=\"true\">\u2733<\/div>\r\n      <h3 class=\"mc-partner-label\">Supporting Organisations<\/h3>\r\n      <p class=\"mc-partner-description\">\r\n        Encouraging creativity through resources, shared expertise and opportunities to learn.\r\n      <\/p>\r\n      <span class=\"mc-partner-symbol\" aria-hidden=\"true\">\u2197<\/span>\r\n    <\/article>\r\n\r\n  <\/div>\r\n\r\n  <div class=\"mc-partners-footer\">\r\n    <span><\/span>\r\n    <p>SHARED IDEAS. COLLECTIVE IMPACT.<\/p>\r\n    <span><\/span>\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<style>\r\n.mc-partners,\r\n.mc-partners * {\r\n  box-sizing: border-box;\r\n}\r\n\r\n.mc-partners {\r\n  width: 100%;\r\n  margin: 0 !important;\r\n  padding: 28px 2.5% !important;\r\n  background: #070A0B;\r\n  color: #F5F3F5;\r\n  font-family: 'Inter', Arial, sans-serif;\r\n  overflow: hidden;\r\n}\r\n\r\n.mc-partners .mc-partners-heading {\r\n  display: grid;\r\n  grid-template-columns: 1fr 0.85fr;\r\n  align-items: end;\r\n  gap: 25px;\r\n  margin: 0 0 20px;\r\n}\r\n\r\n.mc-partners .mc-eyebrow {\r\n  color: #19D8C4;\r\n  font-size: 10px;\r\n  font-weight: 800;\r\n  letter-spacing: 2px;\r\n  line-height: 1.5;\r\n  margin: 0 0 8px;\r\n}\r\n\r\n.mc-partners h2 {\r\n  color: #F5F3F5;\r\n  font-family: 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  font-size: clamp(25px, 3vw, 38px);\r\n  font-weight: 800;\r\n  letter-spacing: -1px;\r\n  line-height: 1.15;\r\n  margin: 0;\r\n}\r\n\r\n.mc-partners h2 span {\r\n  color: #19D8C4;\r\n}\r\n\r\n.mc-partners .mc-partners-intro {\r\n  max-width: 560px;\r\n  justify-self: end;\r\n  color: #AEB8BD;\r\n  font-size: 12px;\r\n  line-height: 1.7;\r\n  margin: 0;\r\n}\r\n\r\n.mc-partners .mc-partner-list {\r\n  display: grid;\r\n  grid-template-columns: repeat(4, minmax(0, 1fr));\r\n  gap: 10px;\r\n  width: 100%;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n.mc-partners .mc-partner-placeholder {\r\n  position: relative;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  min-width: 0;\r\n  min-height: 0;\r\n  padding: 15px;\r\n  margin: 0;\r\n  background: #15191D;\r\n  border: 1px solid #343B40;\r\n  border-radius: 7px;\r\n  transition: border-color 0.2s ease, background 0.2s ease;\r\n}\r\n\r\n.mc-partners .mc-partner-placeholder:hover {\r\n  background: #1B2226;\r\n  border-color: #19D8C4;\r\n}\r\n\r\n.mc-partners .mc-partner-number {\r\n  display: block;\r\n  padding-right: 20px;\r\n  color: #19D8C4;\r\n  font-size: 9px;\r\n  font-weight: 800;\r\n  letter-spacing: 1px;\r\n  line-height: 1.5;\r\n}\r\n\r\n.mc-partners .mc-partner-icon {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  width: 42px;\r\n  height: 42px;\r\n  margin: 13px 0 11px;\r\n  background: #070A0B;\r\n  border: 1px solid #343B40;\r\n  border-radius: 6px;\r\n  color: #F0A04C;\r\n  font-size: 24px;\r\n  line-height: 1;\r\n}\r\n\r\n.mc-partners .mc-partner-label {\r\n  color: #F5F3F5;\r\n  font-family: 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  font-size: clamp(14px, 1.35vw, 17px);\r\n  font-weight: 700;\r\n  line-height: 1.35;\r\n  margin: 0 0 7px;\r\n  overflow-wrap: anywhere;\r\n}\r\n\r\n.mc-partners .mc-partner-description {\r\n  color: #AEB8BD;\r\n  font-size: 11px;\r\n  line-height: 1.65;\r\n  margin: 0;\r\n  overflow-wrap: anywhere;\r\n}\r\n\r\n.mc-partners .mc-partner-symbol {\r\n  position: absolute;\r\n  top: 13px;\r\n  right: 13px;\r\n  color: #737CB1;\r\n  font-size: 16px;\r\n  line-height: 1;\r\n}\r\n\r\n\/* Compact footer *\/\r\n.mc-partners .mc-partners-footer {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 12px;\r\n  margin-top: 17px;\r\n}\r\n\r\n.mc-partners .mc-partners-footer span {\r\n  width: 45px;\r\n  height: 1px;\r\n  background: #343B40;\r\n}\r\n\r\n.mc-partners .mc-partners-footer p {\r\n  color: #F0A04C;\r\n  font-size: 8px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.7px;\r\n  text-align: center;\r\n  margin: 0;\r\n}\r\n\r\n\/* Tablet *\/\r\n@media (min-width: 601px) and (max-width: 1024px) {\r\n  .mc-partners {\r\n    padding: 25px 2% !important;\r\n  }\r\n\r\n  .mc-partners .mc-partners-heading {\r\n    gap: 15px;\r\n  }\r\n\r\n  .mc-partners .mc-partner-list {\r\n    gap: 8px;\r\n  }\r\n\r\n  .mc-partners .mc-partner-placeholder {\r\n    padding: 11px;\r\n  }\r\n\r\n  .mc-partners .mc-partner-label {\r\n    font-size: 14px;\r\n  }\r\n\r\n  .mc-partners .mc-partner-description {\r\n    font-size: 10px;\r\n  }\r\n}\r\n\r\n\/* Mobile *\/\r\n@media (max-width: 600px) {\r\n  .mc-partners {\r\n    padding: 22px 12px !important;\r\n  }\r\n\r\n  .mc-partners .mc-partners-heading {\r\n    grid-template-columns: 1fr;\r\n    gap: 10px;\r\n    margin-bottom: 16px;\r\n  }\r\n\r\n  .mc-partners h2 {\r\n    font-size: 29px;\r\n    letter-spacing: -0.6px;\r\n  }\r\n\r\n  .mc-partners .mc-partners-intro {\r\n    justify-self: start;\r\n    font-size: 12px;\r\n  }\r\n\r\n  .mc-partners .mc-partner-list {\r\n    grid-template-columns: repeat(4, 190px);\r\n    gap: 10px;\r\n    overflow-x: auto;\r\n    padding-bottom: 8px;\r\n    scrollbar-width: thin;\r\n  }\r\n\r\n  .mc-partners .mc-partner-placeholder {\r\n    padding: 13px;\r\n  }\r\n\r\n  .mc-partners .mc-partner-label {\r\n    font-size: 15px;\r\n  }\r\n\r\n  .mc-partners .mc-partner-description {\r\n    font-size: 11px;\r\n  }\r\n\r\n  .mc-partners .mc-partners-footer {\r\n    margin-top: 13px;\r\n  }\r\n}\r\n\r\n@media (prefers-reduced-motion: reduce) {\r\n  .mc-partners *,\r\n  .mc-partners *::before,\r\n  .mc-partners *::after {\r\n    transition: none !important;\r\n  }\r\n}\r\n<\/style>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-7acb2ed e-con-full e-flex e-con e-parent\" data-id=\"7acb2ed\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0193d3f elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"0193d3f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- CDT MAKER CLUB \u2014 FOOTER\r\nPremium editorial layout with developer credit.\r\nPaste this entire code into your Elementor HTML widget.\r\n-->\r\n<footer class=\"cdtm-footer\" id=\"top\">\r\n  <div class=\"cdtm-footer-accent\" aria-hidden=\"true\"><\/div>\r\n\r\n  <div class=\"cdtm-footer-main\">\r\n    <!-- Brand panel -->\r\n    <div class=\"cdtm-footer-brand-panel\">\r\n      <a class=\"cdtm-footer-brand\" href=\"\/\" aria-label=\"CDT Maker Club home\">\r\n        <span class=\"cdtm-footer-emblem\" aria-hidden=\"true\">\r\n          <span>CDT<\/span><span>MC<\/span>\r\n        <\/span>\r\n        <span class=\"cdtm-footer-brand-text\">\r\n          <strong>CDT MAKER CLUB<\/strong>\r\n          <small>MAKE \u00b7 LEARN \u00b7 BUILD<\/small>\r\n        <\/span>\r\n      <\/a>\r\n\r\n      <p class=\"cdtm-footer-promise\">\r\n        We make things.<br><span>We make possibilities.<\/span>\r\n      <\/p>\r\n\r\n      <p class=\"cdtm-footer-description\">\r\n        A creative technology community where curious minds explore, experiment\r\n        and turn ideas into something real.\r\n      <\/p>\r\n\r\n      <a class=\"cdtm-footer-cta\" href=\"https:\/\/cdtmaker.club\/?page_id=249\">\r\n        JOIN THE COMMUNITY <span aria-hidden=\"true\">\u2197<\/span>\r\n      <\/a>\r\n    <\/div>\r\n\r\n    <!-- Explore links -->\r\n    <nav class=\"cdtm-footer-links\" aria-label=\"Explore CDT Maker Club\">\r\n      <h2><span class=\"cdtm-footer-index\">01<\/span> EXPLORE<\/h2>\r\n      <a href=\"\/\">Home <span aria-hidden=\"true\">\u2197<\/span><\/a>\r\n      <a href=\"https:\/\/cdtmaker.club\/?page_id=219\">About the club <span aria-hidden=\"true\">\u2197<\/span><\/a>\r\n      <a href=\"https:\/\/cdtmaker.club\/?page_id=136\">Projects <span aria-hidden=\"true\">\u2197<\/span><\/a>\r\n      <a href=\"https:\/\/cdtmaker.club\/?page_id=140\">Sessions &amp; workshops <span aria-hidden=\"true\">\u2197<\/span><\/a>\r\n      <a href=\"https:\/\/cdtmaker.club\/?page_id=249\">Get involved <span aria-hidden=\"true\">\u2197<\/span><\/a>\r\n    <\/nav>\r\n\r\n    <!-- Contact \/ creator credit -->\r\n    <div class=\"cdtm-footer-contact-panel\">\r\n      <h2><span class=\"cdtm-footer-index\">02<\/span> LET\u2019S CONNECT<\/h2>\r\n      <p class=\"cdtm-footer-contact-copy\">\r\n        Have an idea, a question or something you want to build?\r\n      <\/p>\r\n      <a class=\"cdtm-footer-contact-link\" href=\"https:\/\/cdtmaker.club\/?page_id=249\">\r\n        <span class=\"cdtm-footer-contact-icon\" aria-hidden=\"true\">\u2197<\/span>\r\n        <span>Get in touch<\/span>\r\n        <span class=\"cdtm-footer-contact-arrow\" aria-hidden=\"true\">\u2192<\/span>\r\n      <\/a>\r\n\r\n      <div class=\"cdtm-footer-credit\">\r\n        <span class=\"cdtm-footer-credit-label\">DESIGNED &amp; DEVELOPED BY<\/span>\r\n        <!-- Replace this text or link if your official developer name\/URL differs -->\r\n        <a class=\"cdtm-footer-credit-name\" href=\"https:\/\/cdtmaker.club\/\" target=\"_blank\" rel=\"noopener noreferrer\">\r\n          Docklands Creative\r\n        <\/a>\r\n        <span class=\"cdtm-footer-credit-tagline\">THOUGHTFUL DESIGN. CREATIVE TECHNOLOGY.<\/span>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"cdtm-footer-bottom\">\r\n    <p class=\"cdtm-footer-copyright\">\r\n      \u00a9 <span class=\"cdtm-footer-year\">2026<\/span> CDT Maker Club.\r\n    <\/p>\r\n\r\n    <p class=\"cdtm-footer-signoff\">\r\n      <span class=\"cdtm-footer-live-dot\" aria-hidden=\"true\"><\/span>\r\n      WE MAKE. WE CREATE.\r\n    <\/p>\r\n\r\n\r\n    <a class=\"cdtm-footer-back\" href=\"#top\">BACK TO TOP <span aria-hidden=\"true\">\u2191<\/span><\/a>\r\n  <\/div>\r\n<\/footer>\r\n\r\n<style>\r\n.cdtm-footer,\r\n.cdtm-footer * { box-sizing: border-box; }\r\n\r\n.cdtm-footer {\r\n  --ft-bg: #070A0B;\r\n  --ft-panel: #0D1416;\r\n  --ft-line: #293438;\r\n  --ft-teal: #19D8C4;\r\n  --ft-white: #F5F3F5;\r\n  --ft-muted: #AEB8BD;\r\n  --ft-orange: #F0A04C;\r\n\r\n  position: relative;\r\n  isolation: isolate;\r\n  width: 100%;\r\n  margin: 0;\r\n  padding: 0 clamp(22px, 5.8vw, 92px);\r\n  overflow: hidden;\r\n  background:\r\n    radial-gradient(ellipse at 4% 0%, rgba(25,216,196,.055), transparent 32%),\r\n    var(--ft-bg);\r\n  color: var(--ft-white);\r\n  border-top: 1px solid var(--ft-line);\r\n  font-family: 'Inter', Arial, sans-serif;\r\n}\r\n\r\n.cdtm-footer a { text-decoration: none; }\r\n\r\n.cdtm-footer-accent {\r\n  position: absolute;\r\n  top: -1px;\r\n  left: 5.8%;\r\n  width: clamp(72px, 10vw, 150px);\r\n  height: 3px;\r\n  background: var(--ft-teal);\r\n}\r\n\r\n\/* Main 3-column composition *\/\r\n.cdtm-footer-main {\r\n  display: grid;\r\n  grid-template-columns: minmax(230px, 1.05fr) minmax(190px, .9fr) minmax(245px, 1fr);\r\n  gap: clamp(34px, 5vw, 82px);\r\n  padding: clamp(56px, 6.5vw, 88px) 0 clamp(48px, 5.5vw, 74px);\r\n}\r\n\r\n.cdtm-footer-brand-panel { min-width: 0; }\r\n\r\n.cdtm-footer-brand {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 13px;\r\n  color: var(--ft-white);\r\n}\r\n\r\n.cdtm-footer-emblem {\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: center;\r\n  gap: 2px;\r\n  width: 49px;\r\n  height: 49px;\r\n  flex: 0 0 49px;\r\n  border: 1px solid var(--ft-teal);\r\n  border-radius: 50%;\r\n  color: var(--ft-teal);\r\n  font: 800 10px\/1 'Space Grotesk', Arial, sans-serif;\r\n  letter-spacing: 1px;\r\n  box-shadow: inset 0 0 0 4px rgba(25,216,196,.055);\r\n  transition: transform .25s ease, background .25s ease;\r\n}\r\n.cdtm-footer-brand:hover .cdtm-footer-emblem {\r\n  transform: rotate(-8deg);\r\n  background: rgba(25,216,196,.09);\r\n}\r\n\r\n.cdtm-footer-brand-text { display: flex; flex-direction: column; gap: 5px; }\r\n.cdtm-footer-brand-text strong {\r\n  font: 800 14px\/1.2 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  letter-spacing: 1.4px;\r\n}\r\n.cdtm-footer-brand-text small {\r\n  color: var(--ft-muted);\r\n  font-size: 9px;\r\n  font-weight: 700;\r\n  letter-spacing: 1.7px;\r\n}\r\n\r\n.cdtm-footer-promise {\r\n  margin: 34px 0 14px;\r\n  font: 700 clamp(27px, 2.6vw, 38px)\/1.14 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  letter-spacing: -1.4px;\r\n}\r\n.cdtm-footer-promise span { color: var(--ft-teal); }\r\n\r\n.cdtm-footer-description {\r\n  max-width: 355px;\r\n  margin: 0;\r\n  color: var(--ft-muted);\r\n  font-size: 13px;\r\n  line-height: 1.85;\r\n}\r\n\r\n.cdtm-footer-cta {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  gap: 23px;\r\n  margin-top: 25px;\r\n  padding: 13px 16px;\r\n  border: 1px solid var(--ft-teal);\r\n  border-radius: 3px;\r\n  background: var(--ft-teal);\r\n  color: #071011 !important;\r\n  font-size: 10px;\r\n  font-weight: 800;\r\n  letter-spacing: 1px;\r\n  transition: color .2s ease, background .2s ease, transform .2s ease;\r\n}\r\n.cdtm-footer-cta span { font-size: 16px; }\r\n.cdtm-footer-cta:hover,\r\n.cdtm-footer-cta:focus-visible {\r\n  background: transparent;\r\n  color: var(--ft-teal) !important;\r\n  transform: translateY(-2px);\r\n}\r\n\r\n\/* Column headings and links *\/\r\n.cdtm-footer-links,\r\n.cdtm-footer-contact-panel { min-width: 0; }\r\n\r\n.cdtm-footer-links h2,\r\n.cdtm-footer-contact-panel h2 {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 11px;\r\n  margin: 5px 0 25px;\r\n  color: var(--ft-white);\r\n  font-size: 11px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.8px;\r\n}\r\n.cdtm-footer-index {\r\n  color: var(--ft-teal);\r\n  font: 700 11px 'Space Grotesk', Arial, sans-serif;\r\n  letter-spacing: 0;\r\n}\r\n\r\n.cdtm-footer-links > a {\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  gap: 12px;\r\n  padding: 13px 0;\r\n  border-bottom: 1px solid var(--ft-line);\r\n  color: var(--ft-muted);\r\n  font-size: 12px;\r\n  line-height: 1.5;\r\n  transition: color .2s ease, padding .2s ease;\r\n}\r\n.cdtm-footer-links > a span {\r\n  color: var(--ft-teal);\r\n  opacity: 0;\r\n  transform: translateX(-5px);\r\n  transition: opacity .2s ease, transform .2s ease;\r\n}\r\n.cdtm-footer-links > a:hover,\r\n.cdtm-footer-links > a:focus-visible {\r\n  padding-left: 4px;\r\n  color: var(--ft-white);\r\n}\r\n.cdtm-footer-links > a:hover span,\r\n.cdtm-footer-links > a:focus-visible span {\r\n  opacity: 1;\r\n  transform: translateX(0);\r\n}\r\n\r\n.cdtm-footer-contact-copy {\r\n  margin: 0 0 20px;\r\n  max-width: 310px;\r\n  color: var(--ft-muted);\r\n  font-size: 13px;\r\n  line-height: 1.8;\r\n}\r\n\r\n.cdtm-footer-contact-link {\r\n  display: grid;\r\n  grid-template-columns: 36px 1fr 18px;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 12px 0;\r\n  border-top: 1px solid var(--ft-line);\r\n  border-bottom: 1px solid var(--ft-line);\r\n  color: var(--ft-white);\r\n  font-size: 12px;\r\n  transition: color .2s ease;\r\n}\r\n.cdtm-footer-contact-icon {\r\n  display: grid;\r\n  place-items: center;\r\n  width: 34px;\r\n  height: 34px;\r\n  border-radius: 50%;\r\n  background: var(--ft-teal);\r\n  color: #071011;\r\n  font-size: 17px;\r\n}\r\n.cdtm-footer-contact-arrow {\r\n  color: var(--ft-teal);\r\n  transition: transform .2s ease;\r\n}\r\n.cdtm-footer-contact-link:hover { color: var(--ft-teal); }\r\n.cdtm-footer-contact-link:hover .cdtm-footer-contact-arrow { transform: translateX(4px); }\r\n\r\n\/* Developer credit inspired by the reference, adapted to CDT styling *\/\r\n.cdtm-footer-credit {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  gap: 8px;\r\n  margin-top: 32px;\r\n  padding-top: 20px;\r\n  border-top: 1px solid rgba(41,52,56,.65);\r\n}\r\n.cdtm-footer-credit-label {\r\n  color: var(--ft-muted);\r\n  font-size: 9px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.7px;\r\n}\r\n.cdtm-footer-credit-name {\r\n  display: inline-block;\r\n  color: var(--ft-teal) !important;\r\n  font: 800 clamp(22px, 2.2vw, 30px)\/1.1 'Space Grotesk', 'Inter', Arial, sans-serif;\r\n  letter-spacing: -1px;\r\n  overflow-wrap: anywhere;\r\n  transition: color .2s ease, transform .2s ease;\r\n}\r\n.cdtm-footer-credit-name:hover { color: var(--ft-orange) !important; transform: translateX(2px); }\r\n.cdtm-footer-credit-tagline {\r\n  color: var(--ft-muted);\r\n  font-size: 9px;\r\n  font-weight: 700;\r\n  letter-spacing: .8px;\r\n  line-height: 1.7;\r\n}\r\n\r\n\/* Bottom utility bar *\/\r\n.cdtm-footer-bottom {\r\n  display: grid;\r\n  grid-template-columns: 1fr auto auto;\r\n  align-items: center;\r\n  gap: 22px;\r\n  padding: 20px 0 22px;\r\n  border-top: 1px solid var(--ft-line);\r\n}\r\n.cdtm-footer-copyright {\r\n  margin: 0;\r\n  color: var(--ft-muted);\r\n  font-size: 10px;\r\n  line-height: 1.7;\r\n}\r\n.cdtm-footer-signoff {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 9px;\r\n  margin: 0;\r\n  color: var(--ft-white);\r\n  font-size: 9px;\r\n  font-weight: 800;\r\n  letter-spacing: 1.3px;\r\n  white-space: nowrap;\r\n}\r\n.cdtm-footer-live-dot {\r\n  width: 7px;\r\n  height: 7px;\r\n  flex: 0 0 7px;\r\n  border-radius: 50%;\r\n  background: var(--ft-teal);\r\n  box-shadow: 0 0 0 4px rgba(25,216,196,.08);\r\n}\r\n.cdtm-footer-back {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  justify-self: end;\r\n  color: var(--ft-white);\r\n  font-size: 9px;\r\n  font-weight: 800;\r\n  letter-spacing: 1px;\r\n  white-space: nowrap;\r\n  transition: color .2s ease;\r\n}\r\n.cdtm-footer-back span {\r\n  color: var(--ft-teal);\r\n  font-size: 16px;\r\n  transition: transform .2s ease;\r\n}\r\n.cdtm-footer-back:hover { color: var(--ft-teal); }\r\n.cdtm-footer-back:hover span { transform: translateY(-3px); }\r\n\r\n\/* Tablet *\/\r\n@media (max-width: 1100px) {\r\n  .cdtm-footer-main {\r\n    grid-template-columns: minmax(220px, .9fr) minmax(180px, .8fr);\r\n    gap: 46px 56px;\r\n  }\r\n  .cdtm-footer-contact-panel { grid-column: 1 \/ -1; }\r\n  .cdtm-footer-contact-panel .cdtm-footer-credit { max-width: 460px; }\r\n  .cdtm-footer-bottom {\r\n    grid-template-columns: 1fr auto;\r\n    gap: 16px 24px;\r\n  }\r\n  .cdtm-footer-signoff { justify-self: end; }\r\n  .cdtm-footer-back { grid-column: 2; grid-row: 2; }\r\n}\r\n\r\n\/* Mobile *\/\r\n@media (max-width: 640px) {\r\n  .cdtm-footer { padding: 0 22px; }\r\n  .cdtm-footer-main {\r\n    grid-template-columns: minmax(0, 1fr);\r\n    gap: 42px;\r\n    padding: 48px 0 40px;\r\n  }\r\n  .cdtm-footer-contact-panel { grid-column: auto; }\r\n  .cdtm-footer-promise { margin-top: 27px; font-size: clamp(30px, 8vw, 38px); }\r\n  .cdtm-footer-description { font-size: 12px; }\r\n  .cdtm-footer-links h2,\r\n  .cdtm-footer-contact-panel h2 { margin-bottom: 18px; }\r\n  .cdtm-footer-links > a { padding: 12px 0; }\r\n  .cdtm-footer-credit { margin-top: 27px; }\r\n  .cdtm-footer-credit-name { font-size: clamp(24px, 7vw, 31px); }\r\n  .cdtm-footer-bottom {\r\n    grid-template-columns: 1fr auto;\r\n    gap: 15px;\r\n    padding: 20px 0 24px;\r\n  }\r\n  .cdtm-footer-copyright { grid-column: 1 \/ -1; }\r\n  .cdtm-footer-signoff { grid-column: 1 \/ -1; grid-row: 2; justify-self: start; }\r\n  .cdtm-footer-back { grid-column: 2; grid-row: 1; }\r\n}\r\n@media (max-width: 360px) {\r\n  .cdtm-footer { padding: 0 17px; }\r\n  .cdtm-footer-signoff { font-size: 8px; letter-spacing: .9px; }\r\n}\r\n@media (prefers-reduced-motion: reduce) {\r\n  .cdtm-footer *, .cdtm-footer *::before, .cdtm-footer *::after {\r\n    transition: none !important;\r\n    scroll-behavior: auto !important;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<script>\r\n(function () {\r\n  var footer = document.querySelector('.cdtm-footer');\r\n  if (!footer) return;\r\n  var year = footer.querySelector('.cdtm-footer-year');\r\n  if (year) year.textContent = new Date().getFullYear();\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>FROM IDEA TO CREATION Think it. Make it. Bring it to life. Every creation starts with curiosity. Here&#8217;s how ideas become real. EXPLORE THE PROCESS \u2193 IDEAS IN MOTION CREATIVITY \/ TECHNOLOGY 01 MAKING IS A JOURNEY THE CREATIVE JOURNEY From first thoughtto final creation. Ideas aren&#8217;t built in a single moment. They grow through [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-136","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/cdtmaker.club\/index.php?rest_route=\/wp\/v2\/pages\/136","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cdtmaker.club\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cdtmaker.club\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cdtmaker.club\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/cdtmaker.club\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=136"}],"version-history":[{"count":155,"href":"https:\/\/cdtmaker.club\/index.php?rest_route=\/wp\/v2\/pages\/136\/revisions"}],"predecessor-version":[{"id":1301,"href":"https:\/\/cdtmaker.club\/index.php?rest_route=\/wp\/v2\/pages\/136\/revisions\/1301"}],"wp:attachment":[{"href":"https:\/\/cdtmaker.club\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=136"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}