.elementor-189615 .elementor-element.elementor-element-56c0c86{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0px;--padding-bottom:30px;--padding-left:60px;--padding-right:60px;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-56c0c86.e-con{--align-self:center;--flex-grow:1;--flex-shrink:0;}.elementor-189615 .elementor-element.elementor-element-b203bbf{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:25px 25px;--row-gap:25px;--column-gap:25px;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-b203bbf.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-189615 .elementor-element.elementor-element-7c88f23 > .elementor-widget-container{background-color:#D002191A;padding:12px 18px 12px 18px;border-style:solid;border-width:1px 1px 1px 1px;border-color:#D0021938;border-radius:37px 37px 37px 37px;}.elementor-189615 .elementor-element.elementor-element-7c88f23.ha-has-bg-overlay:hover > .elementor-widget-container::before{transition:background 0.3s;}.elementor-189615 .elementor-element.elementor-element-7c88f23{font-size:13px;font-weight:600;text-transform:uppercase;line-height:1.3em;color:var( --e-global-color-469fccb );}.elementor-189615 .elementor-element.elementor-element-8aa5b8e{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-0538299 #ekit-popup-modal-toggler{background-color:var( --e-global-color-469fccb );font-size:15px;font-weight:600;line-height:1.3em;letter-spacing:0px;color:var( --e-global-color-f3dcfc7 );border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-469fccb );border-radius:37px 37px 37px 37px;}.elementor-189615 .elementor-element.elementor-element-0538299.elementor-element{--align-self:center;}.elementor-189615 .elementor-element.elementor-element-0538299 .ekit-popup-modal__toggler-wrapper{text-align:center;}.elementor-189615 .elementor-element.elementor-element-0538299 .ekit-popup-modal-toggler{padding:18px 28px 18px 28px;}.elementor-189615 .elementor-element.elementor-element-0538299 #ekit-popup-modal-toggler:hover{border-radius:37px 37px 37px 37px;}.elementor-189615 .elementor-element.elementor-element-0538299 .ekit-popup__content{width:700px;max-height:90vh;padding:30px 30px 30px 30px;}.elementor-189615 .elementor-element.elementor-element-0538299 .ekit-popup-modal__close{right:32px;height:20px;width:20px;border-radius:2px 2px 2px 2px;}.elementor-189615 .elementor-element.elementor-element-0538299 .ekit-popup-modal__content{border-radius:12px 12px 12px 12px;}.elementor-189615 .elementor-element.elementor-element-0538299 .ekit-popup-modal__close i{font-size:28px;}.elementor-189615 .elementor-element.elementor-element-7ebb370{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:25px 25px;--row-gap:25px;--column-gap:25px;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-7ebb370.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-189615 .elementor-element.elementor-element-22d75c8 > .elementor-widget-container{background-color:#D002191A;padding:12px 18px 12px 18px;border-style:solid;border-width:1px 1px 1px 1px;border-color:#D0021938;border-radius:37px 37px 37px 37px;}.elementor-189615 .elementor-element.elementor-element-22d75c8.ha-has-bg-overlay:hover > .elementor-widget-container::before{transition:background 0.3s;}.elementor-189615 .elementor-element.elementor-element-22d75c8{font-size:13px;font-weight:600;text-transform:uppercase;line-height:1.3em;color:var( --e-global-color-469fccb );}.elementor-189615 .elementor-element.elementor-element-c759b4d .elementor-heading-title{font-size:15px;font-weight:600;text-transform:uppercase;line-height:1.2em;color:var( --e-global-color-469fccb );}.elementor-189615 .elementor-element.elementor-element-d2242a5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-d2242a5:not(.elementor-motion-effects-element-type-background), .elementor-189615 .elementor-element.elementor-element-d2242a5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F5F5F5;}.elementor-189615 .elementor-element.elementor-element-426ca0f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-426ca0f:not(.elementor-motion-effects-element-type-background), .elementor-189615 .elementor-element.elementor-element-426ca0f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-f3dcfc7 );}.elementor-189615 .elementor-element.elementor-element-daf43e2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-daf43e2:not(.elementor-motion-effects-element-type-background), .elementor-189615 .elementor-element.elementor-element-daf43e2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F5F5F5;}.elementor-189615 .elementor-element.elementor-element-5119c02{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-5119c02:not(.elementor-motion-effects-element-type-background), .elementor-189615 .elementor-element.elementor-element-5119c02 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-f3dcfc7 );}.elementor-189615 .elementor-element.elementor-element-75f7776{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-75f7776:not(.elementor-motion-effects-element-type-background), .elementor-189615 .elementor-element.elementor-element-75f7776 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F5F5F5;}.elementor-189615 .elementor-element.elementor-element-199233b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-199233b:not(.elementor-motion-effects-element-type-background), .elementor-189615 .elementor-element.elementor-element-199233b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-f3dcfc7 );}.elementor-189615 .elementor-element.elementor-element-f912276{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-f912276:not(.elementor-motion-effects-element-type-background), .elementor-189615 .elementor-element.elementor-element-f912276 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-469fccb );}.elementor-189615 .elementor-element.elementor-element-fbb7a51{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:20px 40px;--row-gap:20px;--column-gap:40px;--padding-top:60px;--padding-bottom:60px;--padding-left:30px;--padding-right:30px;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-fbb7a51:not(.elementor-motion-effects-element-type-background), .elementor-189615 .elementor-element.elementor-element-fbb7a51 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#0A131C;}.elementor-189615 .elementor-element.elementor-element-4350a19{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-41fd568{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-28a2a0c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;overflow:visible;}.elementor-189615 .elementor-element.elementor-element-78cb837d{overflow:visible;}:root{--page-title-display:none;}@media(max-width:1200px){.elementor-189615 .elementor-element.elementor-element-56c0c86{--padding-top:45px;--padding-bottom:75px;--padding-left:60px;--padding-right:60px;}.elementor-189615 .elementor-element.elementor-element-fbb7a51{--padding-top:50px;--padding-bottom:50px;--padding-left:20px;--padding-right:20px;}}@media(max-width:1024px){.elementor-189615 .elementor-element.elementor-element-56c0c86{--padding-top:130px;--padding-bottom:70px;--padding-left:30px;--padding-right:30px;}}@media(max-width:880px){.elementor-189615 .elementor-element.elementor-element-56c0c86{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:120px;--padding-bottom:60px;--padding-left:10px;--padding-right:10px;}.elementor-189615 .elementor-element.elementor-element-b203bbf{--gap:20px 20px;--row-gap:20px;--column-gap:20px;--margin-top:0px;--margin-bottom:25px;--margin-left:0px;--margin-right:0px;}.elementor-189615 .elementor-element.elementor-element-7c88f23{font-size:11px;}.elementor-189615 .elementor-element.elementor-element-0538299 #ekit-popup-modal-toggler{font-size:14px;}.elementor-189615 .elementor-element.elementor-element-7ebb370{--gap:20px 20px;--row-gap:20px;--column-gap:20px;--margin-top:0px;--margin-bottom:25px;--margin-left:0px;--margin-right:0px;}.elementor-189615 .elementor-element.elementor-element-22d75c8{font-size:11px;}.elementor-189615 .elementor-element.elementor-element-c759b4d .elementor-heading-title{font-size:13px;}.elementor-189615 .elementor-element.elementor-element-fbb7a51{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:40px;--padding-bottom:40px;--padding-left:10px;--padding-right:10px;}}@media(max-width:767px){.elementor-189615 .elementor-element.elementor-element-56c0c86{--padding-top:110px;--padding-bottom:50px;--padding-left:10px;--padding-right:10px;}.elementor-189615 .elementor-element.elementor-element-0538299 .ekit-popup__content{width:90%;}.elementor-189615 .elementor-element.elementor-element-c759b4d{text-align:center;}}@media(min-width:768px){.elementor-189615 .elementor-element.elementor-element-56c0c86{--content-width:1300px;}.elementor-189615 .elementor-element.elementor-element-b203bbf{--width:50%;}.elementor-189615 .elementor-element.elementor-element-7ebb370{--width:50%;}.elementor-189615 .elementor-element.elementor-element-d2242a5{--content-width:1250px;}.elementor-189615 .elementor-element.elementor-element-426ca0f{--content-width:1250px;}.elementor-189615 .elementor-element.elementor-element-daf43e2{--content-width:1250px;}.elementor-189615 .elementor-element.elementor-element-5119c02{--content-width:1250px;}.elementor-189615 .elementor-element.elementor-element-75f7776{--content-width:1583px;}.elementor-189615 .elementor-element.elementor-element-199233b{--content-width:1250px;}.elementor-189615 .elementor-element.elementor-element-f912276{--content-width:1250px;}.elementor-189615 .elementor-element.elementor-element-fbb7a51{--content-width:1250px;}.elementor-189615 .elementor-element.elementor-element-28a2a0c{--content-width:1250px;}}@media(max-width:1024px) and (min-width:768px){.elementor-189615 .elementor-element.elementor-element-b203bbf{--width:55%;}.elementor-189615 .elementor-element.elementor-element-7ebb370{--width:55%;}}@media(max-width:880px) and (min-width:768px){.elementor-189615 .elementor-element.elementor-element-b203bbf{--width:100%;}.elementor-189615 .elementor-element.elementor-element-7ebb370{--width:100%;}}/* Start custom CSS for text-editor, class: .elementor-element-7c88f23 */.elementor-189615 .elementor-element.elementor-element-7c88f23 .elementor-widget-container {
    display: inline-flex;
    display: none;
}

.elementor-189615 .elementor-element.elementor-element-7c88f23 .elementor-widget-container p {
    display: flex;
}

.elementor-189615 .elementor-element.elementor-element-7c88f23 .elementor-widget-container p::before {
    content: '';
    align-self: center;
    margin-right: 6px;
    width: 8px;
    height: 8px;
    background: var(--e-global-color-469fccb);
    border-radius: 50%;
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    0% {
        opacity: 0.5;
        transform: scale(1.2);
    }
}/* End custom CSS */
/* Start custom CSS for text-editor, class: .elementor-element-22d75c8 */.elementor-189615 .elementor-element.elementor-element-22d75c8 .elementor-widget-container {
    display: inline-flex;
    display: none;
}

.elementor-189615 .elementor-element.elementor-element-22d75c8 .elementor-widget-container p {
    display: flex;
}

.elementor-189615 .elementor-element.elementor-element-22d75c8 .elementor-widget-container p::before {
    content: '';
    align-self: center;
    margin-right: 6px;
    width: 8px;
    height: 8px;
    background: var(--e-global-color-469fccb);
    border-radius: 50%;
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    0% {
        opacity: 0.5;
        transform: scale(1.2);
    }
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-c759b4d */.elementor-189615 .elementor-element.elementor-element-c759b4d h2 strong {
    font-weight: 700;
    color: var(--e-global-color-469fccb);
}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-dc78275 */.wpcf7[data-wpcf7-id="165683"] {
  --iw-red: #d0021b;
  --iw-red-hover: #b00217;
  --iw-field-bg: #161e2a;
  --iw-field-border: #333d4d;
  font-family: "Poppins", sans-serif;
  max-width: 600px;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-form p {
  margin: 0;
  padding: 0;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-form br {
  display: none;
}

/* Name + Email u dve kolone */
.wpcf7[data-wpcf7-id="165683"] .wpcf7-form p:has(input[name="your-name"]) {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-form label {
  display: flex;
  flex-direction: column;
  gap: 8px;
  color: #ffffff;
  font-size: 15px !important;
  font-weight: 600;
  line-height: 1.3em;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-form input[type="text"],
.wpcf7[data-wpcf7-id="165683"] .wpcf7-form input[type="email"] {
  width: 100%;
  height: 46px;
  box-sizing: border-box;
  padding: 0 14px;
  background: var(--iw-field-bg) !important;
  border: 1px solid var(--iw-field-border) !important;
  border-radius: 6px !important;
  color: #ffffff !important;
  font-family: "Poppins", sans-serif;
  font-size: 15px !important;
  outline: none;
  box-shadow: none;
  transition: border-color 0.2s ease;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-form input[type="text"]:focus,
.wpcf7[data-wpcf7-id="165683"] .wpcf7-form input[type="email"]:focus {
  border-color: #6b7686 !important;
}

/* Acceptance red (pregazuje inline stilove) */
.wpcf7[data-wpcf7-id="165683"] .spanJobDarkMode {
  position: relative;
  display: block !important;
  margin: 18px 0 0 !important;
  padding-left: 30px;
  font-size: 13px !important;
  line-height: 1.6em;
  color: #cbd2dd;
}

.wpcf7[data-wpcf7-id="165683"] .spanJobDarkMode a {
  color: inherit;
  text-decoration: none;
}

.wpcf7[data-wpcf7-id="165683"] .spanJobDarkMode a:hover {
  text-decoration: underline;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-acceptance {
  position: absolute;
  left: -30px;
  top: 2px;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-list-item {
  margin: 0;
}

.wpcf7[data-wpcf7-id="165683"] input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  width: 17px;
  height: 17px;
  margin: 0;
  background: transparent;
  border: 1.5px solid #ffffff;
  border-radius: 2px;
  cursor: pointer;
}

.wpcf7[data-wpcf7-id="165683"] input[type="checkbox"]:checked {
  background: var(--iw-red);
  border-color: var(--iw-red);
}

.wpcf7[data-wpcf7-id="165683"] input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 0;
  width: 5px;
  height: 10px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* Submit: sakriva "Start Now", prikazuje novi tekst */
.wpcf7[data-wpcf7-id="165683"] .wpcf7-form p:has(.wpcf7-submit) {
  position: relative;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-submit {
  display: block;
  width: 270px;
  height: 50px;
  margin: 20px 0 0;
  padding: 0;
  background: var(--iw-red) !important;
  border: none !important;
  border-radius: 6px;
  color: transparent !important;
  font-size: 0 !important;
  cursor: pointer;
  transition: background 0.2s ease, opacity 0.2s ease;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-submit:hover:not(:disabled) {
  background: var(--iw-red-hover) !important;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-form p:has(.wpcf7-submit)::after {
  content: "Request Assessment";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 270px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

/* Neaktivno dok checkbox nije čekiran */
.wpcf7[data-wpcf7-id="165683"] .wpcf7-submit:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-form p:has(.wpcf7-submit:disabled)::after {
  opacity: 0.55;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-spinner {
  position: absolute;
  left: 284px;
  bottom: 13px;
  margin: 0;
}

/* Validacija i poruke */
.wpcf7[data-wpcf7-id="165683"] .wpcf7-not-valid-tip {
  margin-top: 6px;
  color: #ff6b7a;
  font-size: 12px;
  font-weight: 400;
}

.wpcf7[data-wpcf7-id="165683"] .wpcf7-response-output {
  margin: 18px 0 0 !important;
  padding: 12px 14px !important;
  border-radius: 6px;
  font-size: 14px;
  color: #cbd2dd;
}

@media (max-width: 600px) {
  .wpcf7[data-wpcf7-id="165683"] .wpcf7-form p:has(input[name="your-name"]) {
    grid-template-columns: 1fr;
  }

  .wpcf7[data-wpcf7-id="165683"] .wpcf7-submit,
  .wpcf7[data-wpcf7-id="165683"] .wpcf7-form p:has(.wpcf7-submit)::after {
    width: 100%;
  }

  .wpcf7[data-wpcf7-id="165683"] .wpcf7-spinner {
    left: auto;
    right: 12px;
  }
}/* End custom CSS */
/* Start custom CSS *//* =========================
   DIAGRAM COMPONENT
========================= */

.diagram-wrap {
  position: relative;
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  background: #0f1b2d;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: Poppins, sans-serif;
  overflow: hidden;
}

/* RESET */

.diagram-wrap *,
.diagram-wrap *::before,
.diagram-wrap *::after {
  box-sizing: border-box;
}

/* =========================
   ALERT
========================= */

.d-alert {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(208,2,25,0.08);
  border: 1px solid rgba(208,2,25,0.3);
  border-radius: 10px;
  padding: 12px 18px;
  position: relative;
  z-index: 2;
  animation: alertAppear .5s ease both;
}

@keyframes alertAppear {
  from {
    opacity: 0;
    transform: scale(.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.d-alert-ring {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid #d00219;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex-shrink: 0;
  color: #d00219;
}

.d-alert-ring::before {
  content: '';
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  border: 1.5px solid rgba(208,2,25,0.4);
  animation: ringPulse 1.5s ease-out infinite;
}

@keyframes ringPulse {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(1.7);
    opacity: 0;
  }
}

.d-alert-text {
  display: flex;
  flex-direction: column;
}

.d-alert-text strong {
  font-size: 12px;
  font-weight: 700;
  color: #fff;
}

.d-alert-text span {
  font-size: 10px;
  color: rgba(255,255,255,0.45);
  font-family: monospace;
}

.d-alert-time {
  margin-left: auto;
  font-size: 11px;
  color: #d00219;
  font-family: monospace;
}

/* =========================
   SVG LINES
========================= */

.d-lines-top {
  width: 100%;
  height: 48px;
  overflow: visible;
}

.d-lines-mid {
  width: 100%;
  height: 60px;
  overflow: visible;
}

.d-line {
  stroke: rgba(208,2,25,0.35);
  stroke-width: 1;
  fill: none;
  stroke-dasharray: 200;
  stroke-dashoffset: 200;
  animation: drawLine .6s ease forwards;
  vector-effect: non-scaling-stroke;
  will-change: opacity, transform;
}

@keyframes drawLine {
  to {
    stroke-dashoffset: 0;
  }
}

/* =========================
   SOURCES
========================= */

.d-sources {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  position: relative;
  z-index: 2;
}

.d-source {
  flex: 1;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 10px 6px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  opacity: 0;
  animation: nodeAppear .4s ease forwards;
}

.d-source:nth-child(1){animation-delay:.7s}
.d-source:nth-child(2){animation-delay:.85s}
.d-source:nth-child(3){animation-delay:1s}
.d-source:nth-child(4){animation-delay:1.15s}
.d-source:nth-child(5){animation-delay:1.3s}

@keyframes nodeAppear {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.d-source-icon {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
}

.d-source-label {
  font-size: 9px;
  font-weight: 600;
  color: rgba(255,255,255,0.45);
  letter-spacing: .04em;
  text-align: center;
}

/* =========================
   ARGUS
========================= */

.d-argus-wrap {
  position: relative;
  z-index: 2;
}

.d-argus {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, #2a0820, #0f1b2d);
  border: 2px solid rgba(34, 197, 94, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  opacity: 0;
  animation: argusAppear .5s ease 2s forwards;
}

@keyframes argusAppear {
  from {
    opacity: 0;
    transform: scale(.7);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.d-argus::before {
  content: '';
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: 1px dashed rgba(208,2,25,0.25);
  animation: argusSpin 8s linear infinite;
}

.d-argus::after {
  content: '';
  position: absolute;
  inset: -16px;
  border-radius: 50%;
  border: 1px dashed rgba(208,2,25,0.12);
  animation: argusSpin 14s linear infinite reverse;
}

@keyframes argusSpin {
  to {
    transform: rotate(360deg);
  }
}

.d-argus-inner {
  text-align: center;
}

.d-argus-label {
  font-size: 13px;
  font-weight: 800;
  color: #fff;
  letter-spacing: 2px;
}

.d-argus-sub {
  font-size: 8px;
  color: #22c55e;
  letter-spacing: .12em;
  font-family: monospace;
}

.d-processing {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  margin-top: 4px;
}

.d-proc-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #22c55e;
  animation: procBlink 1s ease infinite;
}

.d-proc-dot:nth-child(2){
  animation-delay: .2s;
}

.d-proc-dot:nth-child(3){
  animation-delay: .4s;
}

@keyframes procBlink {
  0%,100% {
    opacity: .2;
  }
  50% {
    opacity: 1;
  }
}

/* =========================
   OUTPUT
========================= */

.d-output {
  width: 100%;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(208,2,25,0.22);
  border-radius: 10px;
  overflow: hidden;
  opacity: 0;
  animation: outputAppear .6s ease 2.8s forwards;
}

@keyframes outputAppear {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.d-output-hdr {
  background: rgba(208,2,25,0.06);
  border-bottom: 1px solid rgba(208,2,25,0.12);
  padding: 10px 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.d-badge {
  background: #d00219;
  color: #fff;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 3px 7px;
  border-radius: 3px;
}

.d-output-id {
  font-size: 10px;
  color: rgba(255,255,255,0.4);
  font-family: monospace;
}

.d-blink-wrap {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 4px;
}

.d-blink {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #22c55e;
  animation: blinkGreen 1.5s infinite;
}

@keyframes blinkGreen {
  0%,100% {
    opacity: 1;
  }
  50% {
    opacity: .2;
  }
}

.d-blink-t {
  font-size: 10px;
  color: #22c55e;
  font-family: monospace;
}

.d-output-rows {
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.d-key {
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #d00219;
  font-family: monospace;
  margin-bottom: 3px;
}

.d-val {
  font-size: 11px;
  line-height: 1.5;
  color: rgba(255,255,255,0.55);
  font-family: monospace;
}

.d-val strong {
  color: #fff;
}

.d-action {
  background: rgba(208,2,25,0.07);
  border: 1px solid rgba(208,2,25,0.18);
  border-radius: 6px;
  padding: 8px 10px;
}

.d-action .d-key {
  color: #ff9aa5;
}

.d-action .d-val {
  color: #fff;
}

.d-output-foot {
  padding: 10px 16px;
  border-top: 1px solid rgba(255,255,255,0.05);
  display: flex;
  align-items: center;
  gap: 6px;
}

.d-output-foot span {
  font-size: 9px;
  color: rgba(255,255,255,0.3);
  font-family: monospace;
}

/* =========================
   MOBILE
========================= */

@media (max-width: 600px) {

  .diagram-wrap {
    padding: 24px;
  }

  .d-alert {
    padding: 10px 12px;
  }

  .d-alert-text span {
    font-size: 9px;
  }

  .d-val {
    font-size: 10px;
  }

}

.output-block {
  margin-top: 40px;
  background: #0f1b2d;
  border: 1px solid rgba(208, 2, 25, 0.18);
  border-radius: 12px;
  overflow: hidden;
}

/* HEADER */
.output-hdr {
  background: rgba(208, 2, 25, 0.06);
  border-bottom: 1px solid rgba(208, 2, 25, 0.12);
  padding: 14px 28px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.output-hdr strong {
  color: #d00219;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.output-hdr span {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.35);
  font-family: monospace;
}

/* GRID */
.output-cells {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

/* CELL */
.output-cell {
  padding: 22px 28px;
  border-right: 1px solid rgba(255, 255, 255, 0.05);
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.output-cell:nth-child(3n) {
  border-right: none;
}

.output-cell:nth-last-child(-n+3) {
  border-bottom: none;
}

/* KEY LABEL */
.o-key {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #d00219;
  font-family: monospace;
  margin-bottom: 8px;
}

/* VALUE TEXT */
.o-val {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.5;
  font-family: monospace;
}

.o-val strong {
  color: rgba(255, 255, 255, 0.9);
}

/* FOOTNOTE */
.output-note {
  padding: 18px 28px;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.output-note p {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.4);
  font-style: italic;
  margin: 0;
}/* End custom CSS */