/* =========================================================
   IRVING STUDIO — PROJECT INTAKE MODAL
   Namespaced to prevent collisions with the main site CSS.
   All modal classes use the irving-intake-* namespace.
========================================================= */


/* =========================================================
   PROJECT INTAKE MODAL
   Editorial / Technical Interface
========================================================= */

.irving-intake-project-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 30px;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transition:
    opacity 0.45s ease,
    visibility 0.45s ease;
}


/* OPEN STATE */

.irving-intake-project-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}


/* BACKDROP */

.irving-intake-project-modal-backdrop {
  position: absolute;
  inset: 0;

  background:
    radial-gradient(
      circle at 50% 30%,
      rgba(124, 58, 237, 0.10),
      transparent 40%
    ),
    rgba(5, 5, 10, 0.82);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}


/* =========================================================
   PANEL
========================================================= */

.irving-intake-project-panel {
  position: relative;

  width: min(1180px, 100%);
  max-height: calc(100vh - 60px);

  overflow: auto;

  background:
    linear-gradient(
      rgba(255,255,255,0.025) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,0.025) 1px,
      transparent 1px
    ),
    #0b0b12;

  background-size:
    44px 44px,
    44px 44px;

  border: 1px solid rgba(255,255,255,0.10);

  box-shadow:
    0 40px 120px rgba(0,0,0,0.55),
    0 0 100px rgba(124,58,237,0.10);

  transform:
    translateY(25px)
    scale(0.98);

  transition:
    transform 0.55s cubic-bezier(.16,1,.3,1);

  scrollbar-width: thin;
  scrollbar-color:
    rgba(124,58,237,0.5)
    transparent;
}

.irving-intake-project-modal.is-open .irving-intake-project-panel {
  transform:
    translateY(0)
    scale(1);
}


/* PURPLE TECHNICAL EDGE */

.irving-intake-project-panel::before {
  content: "";

  position: absolute;

  top: 0;
  left: 0;

  width: 180px;
  height: 2px;

  background:
    linear-gradient(
      90deg,
      #7c3aed,
      rgba(124,58,237,0)
    );
}


/* =========================================================
   TOP BAR
========================================================= */

.irving-intake-project-panel-top {
  min-height: 64px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 0 28px;

  border-bottom:
    1px solid rgba(255,255,255,0.08);

  background:
    rgba(255,255,255,0.018);
}


.irving-intake-project-system-id {
  display: flex;
  align-items: center;
  gap: 10px;

  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;

  color: rgba(255,255,255,0.72);
}


.irving-intake-project-system-code {
  margin-left: 12px;

  color:
    rgba(255,255,255,0.28);
}


/* STATUS DOT */

.irving-intake-project-status-dot {
  width: 7px;
  height: 7px;

  flex: 0 0 7px;

  border-radius: 50%;

  background: #8b5cf6;

  box-shadow:
    0 0 0 4px rgba(139,92,246,0.08),
    0 0 14px rgba(139,92,246,0.65);

  animation:
    irvingIntakePulse 2.4s ease-in-out infinite;
}


@keyframes irvingIntakePulse {

  0%,
  100% {
    opacity: .55;
  }

  50% {
    opacity: 1;
  }

}


/* CLOSE BUTTON */

.irving-intake-project-modal-close {
  position: relative;

  width: 36px;
  height: 36px;

  padding: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  background: transparent;
  border: 0;

  cursor: pointer;

  color: #fff;
}


.irving-intake-project-modal-close span {
  position: absolute;

  width: 18px;
  height: 1px;

  background: currentColor;

  transition:
    transform .3s ease,
    opacity .3s ease;
}


.irving-intake-project-modal-close span:first-child {
  transform: rotate(45deg);
}


.irving-intake-project-modal-close span:last-child {
  transform: rotate(-45deg);
}


.irving-intake-project-modal-close:hover span:first-child {
  transform:
    rotate(45deg)
    scaleX(1.2);
}


.irving-intake-project-modal-close:hover span:last-child {
  transform:
    rotate(-45deg)
    scaleX(1.2);
}


/* =========================================================
   MAIN GRID
========================================================= */

.irving-intake-project-panel-grid {

  display: grid;

  grid-template-columns:
    minmax(0, .9fr)
    minmax(400px, 1.1fr);

  min-height: 650px;
}


/* =========================================================
   LEFT EDITORIAL SIDE
========================================================= */

.irving-intake-project-panel-intro {

  position: relative;

  padding: 70px 58px 55px;

  border-right:
    1px solid rgba(255,255,255,0.08);

  overflow: hidden;
}


.irving-intake-project-panel-intro::after {
  content: "";

  position: absolute;

  width: 300px;
  height: 300px;

  left: -150px;
  bottom: -180px;

  border-radius: 50%;

  border:
    1px solid rgba(124,58,237,0.15);

  box-shadow:
    0 0 100px rgba(124,58,237,0.08);
}


/* KICKER */

.irving-intake-project-kicker {
  display: flex;
  align-items: center;
  gap: 13px;

  margin: 0 0 32px;

  font-size: 10px;
  font-weight: 700;

  letter-spacing: .18em;

  color:
    rgba(255,255,255,.48);
}


.irving-intake-project-kicker span {
  color: #a78bfa;
}


/* HEADING */

.irving-intake-project-panel-intro h2 {

  max-width: 570px;

  margin: 0;

  font-size:
    clamp(42px, 5vw, 76px);

  line-height: .93;

  letter-spacing: -.055em;

  font-weight: 500;

  color: #fff;
}


.irving-intake-project-panel-intro h2 em {
  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-weight: 400;

  color: #a78bfa;
}


/* DESCRIPTION */

.irving-intake-project-intro-copy {

  max-width: 410px;

  margin:
    30px 0 0;

  font-size: 14px;

  line-height: 1.8;

  color:
    rgba(255,255,255,.50);
}


/* =========================================================
   NETWORK VISUAL
========================================================= */

.irving-intake-project-network-visual {

  position: absolute;
display: none;
  left: 45px;
  right: 45px;
  bottom: 25px;

  height: 230px;

  overflow: hidden;

  border:
    1px solid rgba(255,255,255,.06);

  background:
    rgba(255,255,255,.012);
}


/* GRID */

.irving-intake-network-grid {

  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      rgba(255,255,255,.035) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,.035) 1px,
      transparent 1px
    );

  background-size: 28px 28px;

  opacity: .5;
}


/* NETWORK LINES */

.irving-intake-network-lines {

  position: absolute;

  inset: 0;

  width: 100%;
  height: 100%;
}


.irving-intake-network-lines path {

  fill: none;

  stroke:
    rgba(139,92,246,.42);

  stroke-width: 1;

  stroke-dasharray: 4 7;

  animation:
    irvingIntakeNetworkFlow 9s linear infinite;
}


@keyframes irvingIntakeNetworkFlow {

  to {
    stroke-dashoffset: -80;
  }

}


/* NODES */

.irving-intake-network-node {

  position: absolute;

  width: 8px;
  height: 8px;

  border-radius: 50%;

  background: #8b5cf6;

  box-shadow:
    0 0 0 5px rgba(139,92,246,.08),
    0 0 18px rgba(139,92,246,.7);

  z-index: 2;
}


.irving-intake-node-a {
  left: 18%;
  top: 25%;
}


.irving-intake-node-b {
  left: 49%;
  top: 48%;
}


.irving-intake-node-c {
  right: 17%;
  top: 22%;
}


.irving-intake-node-d {
  left: 24%;
  bottom: 17%;
}


/* NETWORK LABELS */

.irving-intake-network-label {

  position: absolute;

  font-size: 8px;

  font-weight: 700;

  letter-spacing: .16em;

  color:
    rgba(255,255,255,.30);
}


.irving-intake-label-a {
  left: 12%;
  top: 12%;
}


.irving-intake-label-b {
  left: 53%;
  top: 57%;
}


.irving-intake-label-c {
  right: 10%;
  top: 10%;
}


/* COORDINATE */

.irving-intake-network-coordinate {

  position: absolute;

  right: 14px;
  bottom: 12px;

  font-family:
    monospace;

  font-size: 8px;

  letter-spacing: .12em;

  color:
    rgba(255,255,255,.22);
}


/* =========================================================
   FORM
========================================================= */

.irving-intake-project-panel-form {

  padding:
    50px 55px 40px;
}


.irving-intake-project-field {

  margin-bottom: 27px;
}


.irving-intake-project-field label {

  display: flex;
  align-items: center;
  gap: 10px;

  margin-bottom: 10px;

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .15em;

  color:
    rgba(255,255,255,.42);
}


.irving-intake-project-field label > span {

  color: #a78bfa;

  font-family: monospace;
}


/* INPUTS */

.irving-intake-project-field input,
.irving-intake-project-field textarea,
.irving-intake-project-field select {

  width: 100%;

  box-sizing: border-box;

  border: 0;
  border-bottom:
    1px solid rgba(255,255,255,.12);

  border-radius: 0;

  padding:
    12px 0;

  background: transparent;

  color: #fff;

  font-family: inherit;

  font-size: 14px;

  outline: none;

  transition:
    border-color .3s ease,
    color .3s ease;
}


.irving-intake-project-field input::placeholder,
.irving-intake-project-field textarea::placeholder {

  color:
    rgba(255,255,255,.24);
}


.irving-intake-project-field input:focus,
.irving-intake-project-field textarea:focus,
.irving-intake-project-field select:focus {

  border-color:
    #8b5cf6;
}


.irving-intake-project-field textarea {

  resize: vertical;

  min-height: 105px;

  line-height: 1.7;
}


/* SELECT */

.irving-intake-project-field select {

  appearance: none;

  cursor: pointer;

  background:
    transparent;

}


/* =========================================================
   PROJECT OPTIONS
========================================================= */

.irving-intake-project-options {

  display: flex;

  flex-wrap: wrap;

  gap: 7px;
}


.irving-intake-project-option {

  position: relative;

  margin: 0 !important;

  cursor: pointer;
}


.irving-intake-project-option input {

  position: absolute;

  opacity: 0;

  pointer-events: none;
}


.irving-intake-project-option span {

  display: block;

  padding:
    10px 13px;

  border:
    1px solid rgba(255,255,255,.10);

  font-size: 10px !important;

  font-weight: 500 !important;

  letter-spacing: .02em !important;

  color:
    rgba(255,255,255,.55) !important;

  transition:
    border-color .25s ease,
    background .25s ease,
    color .25s ease;
}


.irving-intake-project-option:hover span {

  border-color:
    rgba(139,92,246,.45);

  color: #fff !important;
}


.irving-intake-project-option input:checked + span {

  background:
    rgba(124,58,237,.14);

  border-color:
    rgba(139,92,246,.8);

  color:
    #c4b5fd !important;

  box-shadow:
    inset 0 0 20px rgba(124,58,237,.06);
}


/* =========================================================
   SUBMIT
========================================================= */

.irving-intake-project-submit-row {

  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 20px;

  padding-top: 8px;
}


.irving-intake-project-submit-meta {

  display: flex;

  align-items: center;

  gap: 9px;

  font-family: monospace;

  font-size: 8px;

  letter-spacing: .14em;

  color:
    rgba(255,255,255,.30);
}


/* SUBMIT BUTTON */

.irving-intake-project-submit {

  display: inline-flex;

  align-items: center;
  justify-content: center;

  gap: 18px;

  min-height: 50px;

  padding:
    0 20px;

  border:
    1px solid rgba(139,92,246,.55);

  background:
    rgba(124,58,237,.10);

  color: #fff;

  font-family: inherit;

  font-size: 10px;
  font-weight: 700;

  letter-spacing: .12em;

  cursor: pointer;

  transition:
    background .3s ease,
    border-color .3s ease,
    transform .3s ease;
}


.irving-intake-project-submit:hover {

  background:
    rgba(124,58,237,.22);

  border-color:
    rgba(167,139,250,.9);

  transform:
    translateY(-2px);
}


.irving-intake-project-submit .irving-intake-button-arrow {

  width: 20px;
  height: 20px;

  display: inline-flex;

  align-items: center;
  justify-content: center;
}


.irving-intake-project-submit .irving-intake-button-arrow svg {

  width: 18px;
  height: 18px;

  display: block;
}


/* =========================================================
   FOOTER
========================================================= */

.irving-intake-project-panel-footer {

  min-height: 48px;

  display: flex;
  align-items: center;

  gap: 15px;

  padding:
    0 28px;

  border-top:
    1px solid rgba(255,255,255,.07);

  font-family: monospace;

  font-size: 8px;

  letter-spacing: .13em;

  color:
    rgba(255,255,255,.24);
}


.irving-intake-footer-line {

  width: 35px;
  height: 1px;

  background:
    rgba(255,255,255,.12);
}


/* =========================================================
   LIGHT MODE
========================================================= */

body:not(.dark) .irving-intake-project-panel,
[data-theme="light"] .irving-intake-project-panel {

  background:
    linear-gradient(
      rgba(15,15,20,.035) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(15,15,20,.035) 1px,
      transparent 1px
    ),
    #f7f7fb;

  color: #111;
}


body:not(.dark) .irving-intake-project-panel-intro h2,
[data-theme="light"] .irving-intake-project-panel-intro h2 {

  color: #111;
}


body:not(.dark) .irving-intake-project-intro-copy,
[data-theme="light"] .irving-intake-project-intro-copy {

  color:
    rgba(15,15,20,.55);
}


body:not(.dark) .irving-intake-project-panel-top,
[data-theme="light"] .irving-intake-project-panel-top {

  border-color:
    rgba(15,15,20,.09);
}


body:not(.dark) .irving-intake-project-system-id,
[data-theme="light"] .irving-intake-project-system-id {

  color:
    rgba(15,15,20,.55);
}


body:not(.dark) .irving-intake-project-panel-intro,
[data-theme="light"] .irving-intake-project-panel-intro {

  border-color:
    rgba(15,15,20,.09);
}


body:not(.dark) .irving-intake-project-field input,
body:not(.dark) .irving-intake-project-field textarea,
body:not(.dark) .irving-intake-project-field select,
[data-theme="light"] .irving-intake-project-field input,
[data-theme="light"] .irving-intake-project-field textarea,
[data-theme="light"] .irving-intake-project-field select {

  color: #111;

  border-color:
    rgba(15,15,20,.14);
}


body:not(.dark) .irving-intake-project-field input::placeholder,
body:not(.dark) .irving-intake-project-field textarea::placeholder,
[data-theme="light"] .irving-intake-project-field input::placeholder,
[data-theme="light"] .irving-intake-project-field textarea::placeholder {

  color:
    rgba(15,15,20,.35);
}


body:not(.dark) .irving-intake-project-field label,
[data-theme="light"] .irving-intake-project-field label {

  color:
    rgba(15,15,20,.50);
}


body:not(.dark) .irving-intake-project-option span,
[data-theme="light"] .irving-intake-project-option span {

  color:
    rgba(15,15,20,.58) !important;

  border-color:
    rgba(15,15,20,.12);
}


body:not(.dark) .irving-intake-project-modal-close,
[data-theme="light"] .irving-intake-project-modal-close {

  color: #111;
}


body:not(.dark) .irving-intake-project-panel-footer,
[data-theme="light"] .irving-intake-project-panel-footer {

  color:
    rgba(15,15,20,.35);

  border-color:
    rgba(15,15,20,.08);
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 900px) {

  .irving-intake-project-modal {
    padding: 15px;
  }

  .irving-intake-project-panel-grid {

    grid-template-columns: 1fr;

  }

  .irving-intake-project-panel-intro {

    min-height: 500px;

    border-right: 0;

    border-bottom:
      1px solid rgba(255,255,255,.08);

    padding:
      45px 30px 270px;
  }

  .irving-intake-project-network-visual {

    left: 30px;
    right: 30px;
  }

  .irving-intake-project-panel-form {

    padding:
      40px 30px 35px;
  }

}


@media (max-width: 600px) {

  .irving-intake-project-modal {
    padding: 0;
  }

  .irving-intake-project-panel {

    width: 100%;
    height: 100vh;
    max-height: none;

    border: 0;
  }

  .irving-intake-project-panel-top {

    padding:
      0 20px;
  }

  .irving-intake-project-panel-intro {

    min-height: 520px;

    padding:
      40px 22px 260px;
  }

  .irving-intake-project-panel-intro h2 {

    font-size:
      clamp(40px, 12vw, 58px);
  }

  .irving-intake-project-network-visual {

    left: 22px;
    right: 22px;

    height: 210px;
  }

  .irving-intake-project-panel-form {

    padding:
      38px 22px 30px;
  }

  .irving-intake-project-submit-row {

    align-items: flex-start;

    flex-direction: column;
  }

  .irving-intake-project-submit {

    width: 100%;
  }

  .irving-intake-project-panel-footer {

    display: none;
  }

}


/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {

  .irving-intake-project-modal,
  .irving-intake-project-panel,
  .irving-intake-project-submit,
  .irving-intake-project-option span,
  .irving-intake-project-modal-close span {

    transition: none;
  }

  .irving-intake-project-status-dot,
  .irving-intake-network-lines path {

    animation: none;
  }

}
/* =========================================================
   PROJECT INTAKE MODAL
========================================================= */

.irving-intake-project-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 32px;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transition:
    opacity 0.4s ease,
    visibility 0.4s ease;
}


.irving-intake-project-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}


/* =========================================================
   BACKDROP
========================================================= */

.irving-intake-project-modal-backdrop {
  position: absolute;
  inset: 0;

  background:
    rgba(5, 5, 10, 0.78);

  backdrop-filter:
    blur(18px);

  -webkit-backdrop-filter:
    blur(18px);
}


/* =========================================================
   PANEL
========================================================= */

.irving-intake-project-panel {
  position: relative;
  z-index: 2;

  width: min(1180px, 100%);

  max-height:
    calc(100vh - 64px);

  overflow-y: auto;

  background:
    #0c0b12;

  border:
    1px solid rgba(255,255,255,0.12);

  box-shadow:
    0 40px 100px rgba(0,0,0,0.55);

  transform:
    translateY(25px)
    scale(0.98);

  transition:
    transform 0.5s cubic-bezier(
      0.22,
      1,
      0.36,
      1
    );
}


.irving-intake-project-modal.is-open .irving-intake-project-panel {
  transform:
    translateY(0)
    scale(1);
}


/* =========================================================
   BACKGROUND GRID
========================================================= */

.irving-intake-project-panel-grid {
  position: absolute;
  inset: 0;

  pointer-events: none;

  opacity: 0.35;

  background-image:

    linear-gradient(
      rgba(255,255,255,0.035) 1px,
      transparent 1px
    ),

    linear-gradient(
      90deg,
      rgba(255,255,255,0.035) 1px,
      transparent 1px
    );

  background-size:
    42px 42px;

  mask-image:
    linear-gradient(
      to bottom,
      black,
      transparent 90%
    );

  -webkit-mask-image:
    linear-gradient(
      to bottom,
      black,
      transparent 90%
    );
}


/* =========================================================
   TOP BAR
========================================================= */

.irving-intake-project-panel-top {
  position: relative;
  z-index: 5;

  display: flex;
  align-items: center;
  justify-content: space-between;

  min-height: 64px;

  padding:
    0 28px;

  border-bottom:
    1px solid rgba(255,255,255,0.08);
}


.irving-intake-project-system-id {
  display: flex;
  align-items: center;
  gap: 10px;

  font-size: 10px;
  font-weight: 600;

  letter-spacing:
    0.16em;

  color:
    rgba(255,255,255,0.68);
}


.irving-intake-project-system-code {
  margin-left: 8px;

  color:
    rgba(255,255,255,0.28);
}


.irving-intake-project-status-dot {
  width: 7px;
  height: 7px;

  display: inline-block;

  border-radius: 50%;

  background:
    #8b5cf6;

  box-shadow:
    0 0 14px rgba(139,92,246,0.75);
}


/* =========================================================
   CLOSE BUTTON
========================================================= */

.irving-intake-project-modal-close {
  position: relative;

  width: 38px;
  height: 38px;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 0;

  background: transparent;

  border:
    1px solid rgba(255,255,255,0.12);

  cursor: pointer;
}


.irving-intake-project-modal-close span {
  position: absolute;

  width: 15px;
  height: 1px;

  background:
    rgba(255,255,255,0.8);
}


.irving-intake-project-modal-close span:first-child {
  transform: rotate(45deg);
}


.irving-intake-project-modal-close span:last-child {
  transform: rotate(-45deg);
}


.irving-intake-project-modal-close:hover {
  border-color:
    rgba(139,92,246,0.7);
}


/* =========================================================
   CONTENT
========================================================= */

.irving-intake-project-panel-content {
  position: relative;
  z-index: 2;

  display: grid;

  grid-template-columns:
    minmax(0, 1.05fr)
    minmax(420px, 0.95fr);

  min-height: 620px;
}


/* =========================================================
   LEFT COLUMN
========================================================= */

.irving-intake-project-panel-intro {
  position: relative;

  padding:
    70px 60px;

  border-right:
    1px solid rgba(255,255,255,0.09);

  overflow: hidden;
}


.irving-intake-project-kicker {
  display: flex;
  align-items: center;
  gap: 12px;

  margin: 0 0 35px;

  font-size: 10px;
  font-weight: 600;

  letter-spacing:
    0.16em;

  color:
    rgba(255,255,255,0.45);
}


.irving-intake-project-kicker span {
  color:
    #8b5cf6;
}


.irving-intake-project-panel-intro h2 {
  max-width: 620px;

  margin: 0;

  font-size:
    clamp(42px, 5vw, 72px);

  line-height:
    0.98;

  font-weight: 500;

  letter-spacing:
    -0.055em;

  color:
    #ffffff;
}


.irving-intake-project-panel-intro h2 em {
  color:
    #a78bfa;

  font-style:
    normal;
}


.irving-intake-project-intro-copy {
  max-width: 470px;

  margin:
    32px 0 0;

  font-size:
    14px;

  line-height:
    1.8;

  color:
    rgba(255,255,255,0.48);
}


/* =========================================================
   NETWORK VISUAL
========================================================= */

.irving-intake-project-network-visual {
  position: absolute;

  left: 60px;
  right: 60px;
  bottom: 45px;

  height: 230px;

  overflow: hidden;

  border:
    1px solid rgba(255,255,255,0.08);

  background:
    rgba(255,255,255,0.015);
}


.irving-intake-network-grid {
  position: absolute;
  inset: 0;

  opacity: 0.4;

  background-image:

    linear-gradient(
      rgba(255,255,255,0.035) 1px,
      transparent 1px
    ),

    linear-gradient(
      90deg,
      rgba(255,255,255,0.035) 1px,
      transparent 1px
    );

  background-size:
    28px 28px;
}


.irving-intake-network-lines {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;
}


.irving-intake-network-lines path {
  fill: none;

  stroke:
    rgba(139,92,246,0.65);

  stroke-width:
    1;
}


.irving-intake-network-node {
  position: absolute;

  width: 8px;
  height: 8px;

  border-radius: 50%;

  background:
    #8b5cf6;

  box-shadow:
    0 0 18px rgba(139,92,246,0.8);
}


.irving-intake-network-node.irving-intake-node-a {
  left: 17%;
  top: 25%;
}


.irving-intake-network-node.irving-intake-node-b {
  left: 49%;
  top: 44%;
}


.irving-intake-network-node.irving-intake-node-c {
  right: 17%;
  top: 23%;
}


.irving-intake-network-node.irving-intake-node-d {
  left: 49%;
  bottom: 14%;
}


.irving-intake-network-label {
  position: absolute;

  font-size: 8px;
  letter-spacing:
    0.16em;

  color:
    rgba(255,255,255,0.35);
}


.irving-intake-network-label.irving-intake-label-a {
  left: 12%;
  top: 15%;
}


.irving-intake-network-label.irving-intake-label-b {
  left: 51%;
  top: 51%;
}


.irving-intake-network-label.irving-intake-label-c {
  right: 10%;
  top: 13%;
}


.irving-intake-network-coordinate {
  position: absolute;

  right: 14px;
  bottom: 12px;

  font-size: 8px;

  letter-spacing:
    0.14em;

  color:
    rgba(255,255,255,0.25);
}


/* =========================================================
   FORM COLUMN
========================================================= */

.irving-intake-project-panel-form {
  position: relative;

  padding:
    55px 60px;
}


.irving-intake-project-field {
  margin-bottom: 30px;
}


.irving-intake-project-field > label {
  display: flex;
  align-items: center;
  gap: 12px;

  margin-bottom: 11px;

  font-size: 9px;
  font-weight: 600;

  letter-spacing:
    0.15em;

  color:
    rgba(255,255,255,0.42);
}


.irving-intake-project-field > label span {
  color:
    #8b5cf6;
}


.irving-intake-project-field input[type="text"],
.irving-intake-project-field input[type="email"],
.irving-intake-project-field select,
.irving-intake-project-field textarea {
  width: 100%;

  padding:
    14px 0;

  color:
    #ffffff;

  background:
    transparent;

  border: 0;

  border-bottom:
    1px solid rgba(255,255,255,0.13);

  outline: none;

  font-family:
    inherit;

  font-size:
    14px;

  transition:
    border-color 0.25s ease;
}


.irving-intake-project-field input:focus,
.irving-intake-project-field select:focus,
.irving-intake-project-field textarea:focus {
  border-color:
    #8b5cf6;
}


.irving-intake-project-field input::placeholder,
.irving-intake-project-field textarea::placeholder {
  color:
    rgba(255,255,255,0.22);
}


.irving-intake-project-field select {
  appearance: none;

  cursor: pointer;
}


.irving-intake-project-field select option {
  background:
    #0c0b12;

  color:
    #ffffff;
}


.irving-intake-project-field textarea {
  resize: vertical;

  min-height: 110px;
}


/* =========================================================
   PROJECT OPTIONS
========================================================= */

.irving-intake-project-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}


.irving-intake-project-option {
  position: relative;

  cursor: pointer;
}


.irving-intake-project-option input {
  position: absolute;

  opacity: 0;

  pointer-events: none;
}


.irving-intake-project-option span {
  display: block;

  padding:
    10px 13px;

  border:
    1px solid rgba(255,255,255,0.11);

  font-size:
    10px;

  letter-spacing:
    0.05em;

  color:
    rgba(255,255,255,0.48);

  transition:
    0.25s ease;
}


.irving-intake-project-option:hover span {
  border-color:
    rgba(139,92,246,0.5);

  color:
    #ffffff;
}


.irving-intake-project-option input:checked + span {
  color:
    #ffffff;

  border-color:
    #8b5cf6;

  background:
    rgba(139,92,246,0.1);
}


/* =========================================================
   SUBMIT
========================================================= */

.irving-intake-project-submit-row {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 20px;

  margin-top: 38px;
}


.irving-intake-project-submit-meta {
  display: flex;
  align-items: center;
  gap: 9px;

  font-size: 8px;
  font-weight: 600;

  letter-spacing:
    0.15em;

  color:
    rgba(255,255,255,0.3);
}


.irving-intake-project-submit {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  gap: 12px;

  min-height: 48px;

  padding:
    0 20px;

  border:
    1px solid #8b5cf6;

  background:
    #8b5cf6;

  color:
    #ffffff;

  font-family:
    inherit;

  font-size:
    10px;

  font-weight:
    700;

  letter-spacing:
    0.12em;

  cursor: pointer;

  transition:
    transform 0.25s ease,
    background 0.25s ease;
}


.irving-intake-project-submit:hover {
  transform:
    translateY(-2px);

  background:
    #7c3aed;
}


.irving-intake-project-submit:disabled {
  cursor:
    wait;

  opacity:
    0.7;
}


.irving-intake-project-submit .irving-intake-button-arrow {
  display: inline-flex;

  width: 18px;
  height: 18px;
}


.irving-intake-project-submit .irving-intake-button-arrow svg {
  width: 100%;
  height: 100%;
}


/* =========================================================
   FOOTER
========================================================= */

.irving-intake-project-panel-footer {
  position: relative;
  z-index: 3;

  display: flex;
  align-items: center;

  gap: 14px;

  min-height: 48px;

  padding:
    0 28px;

  border-top:
    1px solid rgba(255,255,255,0.08);

  font-size:
    8px;

  font-weight:
    600;

  letter-spacing:
    0.14em;

  color:
    rgba(255,255,255,0.27);
}


.irving-intake-footer-line {
  width: 30px;
  height: 1px;

  background:
    rgba(255,255,255,0.1);
}


/* =========================================================
   BODY LOCK
========================================================= */

body.irving-intake-body-lock {
  overflow: hidden;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 900px) {

  .irving-intake-project-modal {
    padding:
      15px;
  }


  .irving-intake-project-panel {
    max-height:
      calc(100vh - 30px);
  }


  .irving-intake-project-panel-content {
    grid-template-columns:
      1fr;
  }


  .irving-intake-project-panel-intro {
    padding:
      45px 30px 300px;

    border-right:
      0;

    border-bottom:
      1px solid rgba(255,255,255,0.08);
  }


  .irving-intake-project-panel-intro h2 {
    font-size:
      clamp(38px, 9vw, 58px);
  }


  .irving-intake-project-panel-form {
    padding:
      40px 30px;
  }


  .irving-intake-project-network-visual {
    left: 30px;
    right: 30px;
    bottom: 35px;
  }

}


@media (max-width: 600px) {

  .irving-intake-project-panel-top {
    padding:
      0 18px;
  }


  .irving-intake-project-system-id {
    font-size:
      8px;
  }


  .irving-intake-project-panel-intro {
    padding:
      38px 20px 270px;
  }


  .irving-intake-project-panel-form {
    padding:
      35px 20px;
  }


  .irving-intake-project-network-visual {
    left: 20px;
    right: 20px;

    height:
      200px;
  }


  .irving-intake-project-submit-row {
    align-items:
      stretch;

    flex-direction:
      column;
  }


  .irving-intake-project-submit {
    width:
      100%;
  }


  .irving-intake-project-panel-footer {
    flex-wrap:
      wrap;

    padding:
      12px 18px;

    gap:
      8px;
  }


  .irving-intake-footer-line {
    display:
      none;
  }

}


@media (prefers-reduced-motion: reduce) {

  .irving-intake-project-modal,
  .irving-intake-project-panel,
  .irving-intake-project-submit {
    transition:
      none;
  }

}

/* =========================================================
   PROJECT NETWORK VISUAL
========================================================= */

.irving-intake-project-network-visual {
  position: relative;
  width: 100%;
  height: 360px;
  margin-top: 55px;
  overflow: hidden;

  border: 1px solid rgba(255, 255, 255, 0.10);

  background:
    radial-gradient(
      circle at 50% 48%,
      rgba(124, 58, 237, 0.10),
      transparent 34%
    ),
    rgba(255, 255, 255, 0.015);

  isolation: isolate;
}


/* =========================================================
   GRID
========================================================= */

.irving-intake-project-network-visual .irving-intake-network-grid {
  position: absolute;
  inset: 0;

  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.035) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.035) 1px,
      transparent 1px
    );

  background-size: 28px 28px;

  opacity: 0.55;

  mask-image:
    linear-gradient(
      to bottom,
      black 0%,
      black 75%,
      transparent 100%
    );

  -webkit-mask-image:
    linear-gradient(
      to bottom,
      black 0%,
      black 75%,
      transparent 100%
    );
}


/* =========================================================
   AMBIENT GLOW
========================================================= */

.irving-intake-network-glow {
  position: absolute;
  width: 180px;
  height: 180px;

  border-radius: 50%;

  background: rgba(124, 58, 237, 0.12);

  filter: blur(55px);

  pointer-events: none;
}

.irving-intake-network-glow-one {
  top: 70px;
  left: 180px;
}

.irving-intake-network-glow-two {
  right: 50px;
  bottom: 30px;

  opacity: 0.55;
}


/* =========================================================
   TOP META
========================================================= */

.irving-intake-network-top-meta {
  position: absolute;
  top: 16px;
  left: 18px;
  right: 18px;

  display: flex;
  justify-content: space-between;

  font-family: "DM Sans", sans-serif;

  font-size: 8px;
  font-weight: 600;

  letter-spacing: 0.18em;

  color: rgba(255, 255, 255, 0.42);

  z-index: 5;
}

.irving-intake-network-top-meta span:last-child {
  color: #a78bfa;
}


/* =========================================================
   NETWORK SVG
========================================================= */

.irving-intake-project-network-visual .irving-intake-network-lines {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  z-index: 2;

  overflow: visible;
}


/* main paths */

.irving-intake-project-network-visual .irving-intake-network-path {
  fill: none;

  stroke: rgba(255, 255, 255, 0.20);

  stroke-width: 1.2;

  vector-effect: non-scaling-stroke;
}


/* secondary paths */

.irving-intake-project-network-visual .irving-intake-network-path-secondary {
  stroke: rgba(167, 139, 250, 0.13);
}


/* animated data */

.irving-intake-project-network-visual .irving-intake-network-data {
  fill: none;

  stroke: #8b5cf6;

  stroke-width: 1.6;

  stroke-linecap: round;

  stroke-dasharray: 2 16;

  vector-effect: non-scaling-stroke;

  opacity: 0.9;

  animation:
    networkDataFlow 5s linear infinite;
}

@keyframes networkDataFlow {

  from {
    stroke-dashoffset: 0;
  }

  to {
    stroke-dashoffset: -180;
  }

}


/* =========================================================
   NODES
========================================================= */

.irving-intake-project-network-visual .irving-intake-network-node {
  position: absolute;

  width: 12px;
  height: 12px;

  z-index: 6;

  transform: translate(-50%, -50%);
}


/* positions */

.irving-intake-project-network-visual .irving-intake-node-a {
  left: 17.5%;
  top: 25.5%;
}

.irving-intake-project-network-visual .irving-intake-node-b {
  left: 43.5%;
  top: 40.3%;
}

.irving-intake-project-network-visual .irving-intake-node-c {
  left: 69%;
  top: 22.8%;
}

.irving-intake-project-network-visual .irving-intake-node-d {
  left: 86.5%;
  top: 75%;
}


/* central node */

.irving-intake-project-network-visual .irving-intake-node-b {
  width: 16px;
  height: 16px;
}


/* core */

.irving-intake-node-core {
  position: absolute;

  top: 50%;
  left: 50%;

  width: 6px;
  height: 6px;

  transform: translate(-50%, -50%);

  border-radius: 50%;

  background: #c4b5fd;

  box-shadow:
    0 0 0 3px rgba(139, 92, 246, 0.14),
    0 0 18px rgba(139, 92, 246, 0.85);
}


/* pulse ring */

.irving-intake-node-pulse {
  position: absolute;

  inset: -5px;

  border: 1px solid rgba(139, 92, 246, 0.32);

  border-radius: 50%;

  animation:
    nodePulse 3s ease-out infinite;
}

@keyframes nodePulse {

  0% {
    transform: scale(0.7);
    opacity: 0.8;
  }

  70% {
    transform: scale(1.8);
    opacity: 0;
  }

  100% {
    transform: scale(1.8);
    opacity: 0;
  }

}


/* node code */

.irving-intake-node-code {
  position: absolute;

  left: 14px;
  top: -8px;

  font-size: 7px;

  font-weight: 600;

  letter-spacing: 0.12em;

  color: rgba(255, 255, 255, 0.32);
}


/* =========================================================
   CENTRAL CORE
========================================================= */

.irving-intake-project-network-visual .irving-intake-network-core {
  position: absolute;

  left: 55%;
  top: 51%;

  width: 72px;
  height: 72px;

  transform: translate(-50%, -50%);

  z-index: 5;
}


.irving-intake-core-center {
  position: absolute;

  left: 50%;
  top: 50%;

  width: 38px;
  height: 38px;

  transform: translate(-50%, -50%);

  display: flex;
  align-items: center;
  justify-content: center;

  border: 1px solid rgba(167, 139, 250, 0.55);

  border-radius: 50%;

  background: rgba(12, 11, 18, 0.90);

  box-shadow:
    0 0 25px rgba(124, 58, 237, 0.20);
}

.irving-intake-core-center span {
  font-size: 9px;

  font-weight: 700;

  letter-spacing: 0.08em;

  color: #c4b5fd;
}


/* orbit */

.irving-intake-core-orbit {
  position: absolute;

  inset: 4px;

  border: 1px solid rgba(139, 92, 246, 0.18);

  border-radius: 50%;

  animation:
    coreOrbit 8s linear infinite;
}

.irving-intake-core-orbit-two {
  inset: -8px;

  border-color: rgba(255, 255, 255, 0.07);

  animation-direction: reverse;

  animation-duration: 12s;
}

@keyframes coreOrbit {

  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }

}


/* =========================================================
   LABELS
========================================================= */

.irving-intake-network-label {
  position: absolute;

  z-index: 7;

  display: flex;
  flex-direction: column;

  gap: 2px;

  font-size: 8px;
  font-weight: 600;

  letter-spacing: 0.16em;

  color: rgba(255, 255, 255, 0.62);
}

.irving-intake-network-label span {
  font-size: 7px;

  color: rgba(167, 139, 250, 0.8);
}


/* positions */

.irving-intake-project-network-visual .irving-intake-label-a {
  left: 19%;
  top: 17%;
}

.irving-intake-project-network-visual .irving-intake-label-b {
  left: 46%;
  top: 47%;
}

.irving-intake-project-network-visual .irving-intake-label-c {
  right: 21%;
  top: 15%;
}

.irving-intake-project-network-visual .irving-intake-label-d {
  right: 6%;
  bottom: 16%;
}


/* =========================================================
   COORDINATES
========================================================= */

.irving-intake-network-coordinate {
  position: absolute;

  left: 18px;
  bottom: 16px;

  z-index: 8;

  font-family: "DM Sans", sans-serif;

  font-size: 7px;

  letter-spacing: 0.15em;

  color: rgba(255, 255, 255, 0.30);
}

.irving-intake-network-coordinate-right {
  left: auto;
  right: 18px;

  color: rgba(167, 139, 250, 0.65);
}


/* =========================================================
   SCAN LINE
========================================================= */

.irving-intake-network-scan {
  position: absolute;

  left: 0;
  right: 0;

  top: -20%;

  height: 1px;

  z-index: 9;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(167, 139, 250, 0.6),
      transparent
    );

  box-shadow:
    0 0 12px rgba(139, 92, 246, 0.4);

  opacity: 0.45;

  animation:
    networkScan 7s linear infinite;
}

@keyframes networkScan {

  0% {
    top: -10%;
  }

  100% {
    top: 110%;
  }

}


/* =========================================================
   CORNER MARKERS
========================================================= */

.irving-intake-network-corner {
  position: absolute;

  width: 10px;
  height: 10px;

  z-index: 10;
}

.irving-intake-corner-tl {
  top: 10px;
  left: 10px;

  border-top: 1px solid rgba(167, 139, 250, 0.55);
  border-left: 1px solid rgba(167, 139, 250, 0.55);
}

.irving-intake-corner-tr {
  top: 10px;
  right: 10px;

  border-top: 1px solid rgba(167, 139, 250, 0.55);
  border-right: 1px solid rgba(167, 139, 250, 0.55);
}

.irving-intake-corner-bl {
  bottom: 10px;
  left: 10px;

  border-bottom: 1px solid rgba(167, 139, 250, 0.55);
  border-left: 1px solid rgba(167, 139, 250, 0.55);
}

.irving-intake-corner-br {
  bottom: 10px;
  right: 10px;

  border-bottom: 1px solid rgba(167, 139, 250, 0.55);
  border-right: 1px solid rgba(167, 139, 250, 0.55);
}


/* =========================================================
   LIGHT MODE
========================================================= */

body:not(.dark) .irving-intake-project-network-visual {
  background:
    radial-gradient(
      circle at 50% 48%,
      rgba(124, 58, 237, 0.07),
      transparent 34%
    ),
    rgba(20, 20, 30, 0.025);

  border-color: rgba(20, 20, 30, 0.12);
}

body:not(.dark) .irving-intake-project-network-visual .irving-intake-network-grid {
  background-image:
    linear-gradient(
      rgba(20, 20, 30, 0.045) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(20, 20, 30, 0.045) 1px,
      transparent 1px
    );
}

body:not(.dark) .irving-intake-project-network-visual .irving-intake-network-path {
  stroke: rgba(20, 20, 30, 0.18);
}

body:not(.dark) .irving-intake-network-label {
  color: rgba(20, 20, 30, 0.62);
}

body:not(.dark) .irving-intake-network-top-meta {
  color: rgba(20, 20, 30, 0.42);
}

body:not(.dark) .irving-intake-network-coordinate {
  color: rgba(20, 20, 30, 0.35);
}

body:not(.dark) .irving-intake-core-center {
  background: rgba(247, 247, 251, 0.9);
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 768px) {

  .irving-intake-project-network-visual {
    height: 300px;
    margin-top: 40px;
  }

  .irving-intake-network-top-meta {
    font-size: 7px;
  }

  .irving-intake-network-label {
    font-size: 7px;
  }

  .irving-intake-project-network-visual .irving-intake-network-core {
    width: 58px;
    height: 58px;
  }

  .irving-intake-core-center {
    width: 32px;
    height: 32px;
  }

  .irving-intake-core-center span {
    font-size: 8px;
  }

}


@media (max-width: 480px) {

  .irving-intake-project-network-visual {
    height: 250px;
  }

  .irving-intake-project-network-visual .irving-intake-network-core {
    left: 54%;
  }

  .irving-intake-network-label {
    letter-spacing: 0.10em;
  }

  .irving-intake-network-coordinate {
    font-size: 6px;
  }

}

/* =========================================================
   IRVING STUDIO — INVESTMENT SYSTEM
========================================================= */

.investment-section {
  position: relative;
  max-width: var(--max);
  margin: 0 auto;
  padding: 135px 0 0px;
  overflow: hidden;
}


/* TECHNICAL BACKGROUND */

.investment-grid {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .55;

  background-image:
    linear-gradient(
      to right,
      var(--line) 1px,
      transparent 1px
    ),
    linear-gradient(
      to bottom,
      var(--line) 1px,
      transparent 1px
    );

  background-size: 80px 80px;

  mask-image:
    linear-gradient(
      to bottom,
      transparent,
      black 15%,
      black 85%,
      transparent
    );
}


/* INTRO */

.investment-intro {
  position: relative;
  z-index: 2;

  display: grid;
  grid-template-columns: 55% 45%;
  gap: 50px;

  align-items: end;

  margin-bottom: 70px;
}


.investment-intro .eyebrow {
  margin-bottom: 18px;
}


.investment-status {
  display: inline-flex;
  align-items: center;
  gap: 9px;

  margin-bottom: 25px;

  font-size: 10px;
  font-weight: 700;
  letter-spacing: .13em;

  color: var(--muted);
}


.investment-status span {
  width: 6px;
  height: 6px;

  border-radius: 50%;

  background: var(--purple);

  box-shadow:
    0 0 0 4px rgba(96,72,229,.08);
}


.investment-intro h2 {
  margin: 0;

  font-size: clamp(52px, 6vw, 82px);
  line-height: .96;
  letter-spacing: -.065em;
}


.investment-intro h2 em {
  color: var(--purple);
  font-style: normal;
}


.investment-intro > p {
  max-width: 520px;

  margin: 0;

  color: var(--muted);

  font-size: 17px;
  line-height: 1.75;
}


/* PACKAGE SYSTEM */

.investment-system {
  position: relative;
  z-index: 2;

  display: grid;
  grid-template-columns: repeat(3, 1fr);

  gap: 1px;

  border: 1px solid var(--line);

  background: var(--line);
}


/* CARD */

.investment-card {
  position: relative;

  display: flex;
  flex-direction: column;

  min-height: 575px;

  padding: 31px;

  background: var(--bg);

  transition:
    transform .35s ease,
    background .35s ease;
}


.investment-card:hover {
  background: var(--surface);
  transform: translateY(-4px);
}


/* CARD HEADER */

.investment-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;

  padding-bottom: 25px;

  border-bottom: 1px solid var(--line);
}


.investment-number {
  font-size: 12px;
  font-weight: 700;

  color: var(--purple);
}


.investment-label {
  font-size: 10px;
  font-weight: 700;

  letter-spacing: .14em;

  color: var(--muted);
}


/* FEATURED */

.investment-card-featured {
  background:
    linear-gradient(
      145deg,
      rgba(96,72,229,.08),
      transparent 65%
    ),
    var(--bg);
}


.investment-card-featured:hover {
  background:
    linear-gradient(
      145deg,
      rgba(96,72,229,.12),
      transparent 65%
    ),
    var(--surface);
}


.investment-featured-tag {
  position: absolute;

  top: 0;
  right: 0;

  padding: 8px 13px;

  background: var(--purple);

  color: #fff;

  font-size: 9px;
  font-weight: 700;

  letter-spacing: .12em;
}


/* HEADINGS */

.investment-card-heading {
  padding: 42px 0 29px;
}


.investment-card-heading h3 {
  margin: 0 0 17px;

  font-size: clamp(37px, 3vw, 49px);

  line-height: 1;

  letter-spacing: -.055em;
}


.investment-card-heading h3 span {
  color: var(--purple);
}


.investment-card-heading p {
  max-width: 330px;

  margin: 0;

  color: var(--muted);

  font-size: 14px;
  line-height: 1.65;
}


.investment-line {
  width: 100%;
  height: 1px;

  background: var(--line);
}


/* FEATURES */

.investment-features {
  display: grid;

  gap: 0;

  margin: 0;
  padding: 10px 0 20px;

  list-style: none;
}


.investment-features li {
  display: grid;
  grid-template-columns: 25px 1fr;
  gap: 8px;

  padding: 10px 0;

  font-size: 12px;
  line-height: 1.4;

  color: var(--ink);

  border-bottom: 1px solid
    color-mix(
      in srgb,
      var(--line) 65%,
      transparent
    );
}


.investment-features li span {
  color: var(--muted);

  font-size: 9px;
  font-weight: 700;
}


/* CARD CTA */

.investment-link {
  display: flex;
  align-items: center;
  justify-content: space-between;

  width: 100%;

  margin-top: auto;
  padding: 15px 0 0;

  border: 0;

  background: none;

  color: var(--ink);

  font-family: inherit;

  font-size: 12px;
  font-weight: 700;

  text-align: left;

  cursor: pointer;
}


.investment-link span {
  display: flex;

  width: 30px;
  height: 30px;

  align-items: center;
  justify-content: center;

  border: 1px solid var(--line);
  border-radius: 50%;

  color: var(--purple);

  transition:
    background .25s ease,
    color .25s ease,
    transform .25s ease;
}


.investment-link svg {
  width: 13px;
  height: 13px;
}


.investment-link:hover span {
  background: var(--purple);
  color: #fff;

  transform: translate(2px, -2px);
}


/* FOOTER */

.investment-footer {
  position: relative;
  z-index: 2;

  display: grid;
  grid-template-columns: 1fr 1.5fr auto;
  align-items: center;

  gap: 35px;

  padding: 24px 0 0;

  color: var(--muted);

  font-size: 11px;
}


.investment-footer > div {
  display: flex;
  align-items: center;
  gap: 9px;

  font-weight: 700;
  letter-spacing: .1em;
}


.investment-footer-dot {
  width: 6px;
  height: 6px;

  border-radius: 50%;

  background: var(--purple);
}


.investment-footer p {
  margin: 0;

  line-height: 1.5;
}


.investment-footer-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;

  padding: 0;

  border: 0;

  background: none;

  color: var(--ink);

  font: inherit;
  font-weight: 700;

  cursor: pointer;
}


.investment-footer-link svg {
  width: 13px;
  height: 13px;

  color: var(--purple);

  transition: transform .25s ease;
}


.investment-footer-link:hover svg {
  transform: translate(3px, -3px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1000px) {

  .investment-section {
    padding: 105px 0 95px;
  }

  .investment-intro {
    grid-template-columns: 1fr 1fr;
  }

  .investment-system {
    grid-template-columns: 1fr;
  }

  .investment-card {
    min-height: auto;
  }

  .investment-card-featured {
    order: -1;
  }

  .investment-footer {
    grid-template-columns: 1fr 1fr;
  }

  .investment-footer-link {
    justify-self: start;
  }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 650px) {

  .investment-section {
    padding: 80px 0 75px;
  }

  .investment-grid {
    background-size: 50px 50px;
  }

  .investment-intro {
    display: block;

    margin-bottom: 45px;
  }

  .investment-intro h2 {
    font-size: clamp(46px, 13vw, 68px);
  }

  .investment-intro > p {
    margin-top: 28px;

    font-size: 15px;
    line-height: 1.7;
  }

  .investment-system {
    display: block;

    border: 1px solid var(--line);
  }

  .investment-card {
    min-height: auto;

    padding: 25px 21px;
  }

  .investment-card + .investment-card {
    border-top: 1px solid var(--line);
  }

  .investment-card-heading {
    padding: 32px 0 24px;
  }

  .investment-card-heading h3 {
    font-size: 40px;
  }

  .investment-card-heading p {
    font-size: 13px;
  }

  .investment-features li {
    font-size: 12px;
  }

  .investment-footer {
    display: block;

    padding-top: 25px;
  }

  .investment-footer p {
    margin: 18px 0;
  }

}


/* =========================================================
   DARK MODE
========================================================= */

body.dark .investment-grid {
  opacity: .35;
}

body.dark .investment-card-featured {
  background:
    linear-gradient(
      145deg,
      rgba(139,92,246,.10),
      transparent 65%
    ),
    var(--bg);
}

body.dark .investment-card-featured:hover {
  background:
    linear-gradient(
      145deg,
      rgba(139,92,246,.15),
      transparent 65%
    ),
    var(--surface);
}
/* =========================================================
   IRVING STUDIO — MOBILE PROJECT INTAKE POSITIONING
   Navbar
      ↓
   Project Intake Modal
      ↓
   Mobile Bottom Bar
========================================================= */

@media (max-width: 650px) {

  /* -------------------------------------------------------
     MODAL — FULL AVAILABLE MOBILE VIEW
  ------------------------------------------------------- */

  .irving-intake-project-modal {
    position: fixed !important;

    /* IMPORTANT:
       Keep the modal below the fixed navbar
       and above the mobile bottom bar.
    */
    top: 58px !important;
    right: 0 !important;
    bottom: 64px !important;
    left: 0 !important;

    width: 100vw !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: stretch !important;
    justify-content: stretch !important;

    z-index: 9000 !important;

    overflow: hidden !important;
  }


  /* -------------------------------------------------------
     BACKDROP
     Covers ONLY the space between navbar and mobile bar
  ------------------------------------------------------- */

  .irving-intake-project-modal-backdrop {
    position: absolute !important;

    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 100% !important;
  }


  /* -------------------------------------------------------
     PANEL
     100% WIDTH — NO SIDE GAPS
  ------------------------------------------------------- */

  .irving-intake-project-panel {
    position: relative !important;

    width: 100% !important;
    max-width: none !important;

    height: 100% !important;
    max-height: none !important;

    margin: 0 !important;

    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;

    box-sizing: border-box !important;

    border-radius: 0 !important;

    transform: translateY(25px) !important;
  }


  /* OPEN ANIMATION */

  .irving-intake-project-modal.is-open
  .irving-intake-project-panel {
    transform: translateY(0) !important;
  }


  /* -------------------------------------------------------
     TOP BAR
     Stays at the top of the intake panel
  ------------------------------------------------------- */

  .irving-intake-project-panel-top {
    position: sticky !important;
    top: 0 !important;

    width: 100% !important;

    min-height: 58px !important;
    height: 58px !important;

    padding: 0 18px !important;

    box-sizing: border-box !important;

    z-index: 20 !important;

    background: rgba(12, 11, 18, 0.96) !important;

    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
  }


  /* -------------------------------------------------------
     CONTENT
  ------------------------------------------------------- */

  .irving-intake-project-panel-content {
    width: 100% !important;
    max-width: none !important;

    display: block !important;

    min-height: auto !important;
  }


  /* -------------------------------------------------------
     INTRO
  ------------------------------------------------------- */

  .irving-intake-project-panel-intro {
    width: 100% !important;

    box-sizing: border-box !important;

    padding: 38px 20px 110px !important;

    border-right: 0 !important;
  }


  /* -------------------------------------------------------
     FORM
  ------------------------------------------------------- */

  .irving-intake-project-panel-form {
    width: 100% !important;

    box-sizing: border-box !important;

    padding: 35px 20px 40px !important;
  }


  /* -------------------------------------------------------
     NETWORK VISUAL
  ------------------------------------------------------- */

  .irving-intake-project-network-visual {
    width: calc(100% - 40px) !important;

    margin-left: 20px !important;
    margin-right: 20px !important;

    box-sizing: border-box !important;
  }


  /* -------------------------------------------------------
     SUBMIT
  ------------------------------------------------------- */

  .irving-intake-project-submit-row {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  .irving-intake-project-submit {
    width: 100% !important;
  }


  /* -------------------------------------------------------
     FOOTER
  ------------------------------------------------------- */

  .irving-intake-project-panel-footer {
    width: 100% !important;

    box-sizing: border-box !important;
  }
}


/* =========================================================
   VERY SMALL PHONES
========================================================= */

@media (max-width: 480px) {

  .irving-intake-project-modal {
    top: 58px !important;
    bottom: 64px !important;

    width: 100vw !important;
  }

  .irving-intake-project-panel {
    width: 100vw !important;
  }

  .irving-intake-project-panel-top {
    min-height: 56px !important;
    height: 56px !important;
    padding: 0 15px !important;
  }

  .irving-intake-project-panel-intro {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .irving-intake-project-panel-form {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}
/* =========================================================
   IRVING STUDIO — PACKAGES SYSTEM
========================================================= */

.irving-packages-modal {
  position: fixed;
  inset: 0;
  z-index: 9000;

  display: flex;
  align-items: stretch;
  justify-content: stretch;

  visibility: hidden;
  opacity: 0;

  pointer-events: none;

  transition:
    opacity 0.3s ease,
    visibility 0.3s ease;
}


.irving-packages-modal.is-open {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}


/* =========================================================
   BACKDROP
========================================================= */

.irving-packages-backdrop {
  position: absolute;
  inset: 0;

  background:
    rgba(5, 5, 8, 0.78);

  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}


/* =========================================================
   PANEL
========================================================= */

.irving-packages-panel {
  position: relative;

  width: 100%;
  height: 100%;

  overflow: hidden;

  background:
    #0d0d0f;

  color: #f5f5f5;

  border: 1px solid rgba(255,255,255,0.08);

  transform: translateY(25px);

  transition:
    transform 0.45s cubic-bezier(.22,1,.36,1);
}


.irving-packages-modal.is-open
.irving-packages-panel {
  transform: translateY(0);
}


/* =========================================================
   TOP BAR
========================================================= */

.irving-packages-topbar {
  position: sticky;
  top: 0;

  z-index: 20;

  height: 58px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  padding: 0 28px;

  background:
    rgba(13,13,15,0.94);

  border-bottom:
    1px solid rgba(255,255,255,0.08);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}


.irving-packages-system-id {
  display: flex;
  align-items: center;
  gap: 10px;

  font-size: 10px;
  font-weight: 700;

  letter-spacing: .16em;
}


.irving-packages-status-dot {
  width: 6px;
  height: 6px;

  border-radius: 50%;

  background: #22d3ee;

  box-shadow:
    0 0 14px rgba(34,211,238,.8);
}


.irving-packages-system-code {
  color: #777;

  padding-left: 8px;

  border-left:
    1px solid rgba(255,255,255,.12);
}


/* =========================================================
   CLOSE
========================================================= */

.irving-packages-close {
  position: relative;

  width: 38px;
  height: 38px;

  border: 1px solid rgba(255,255,255,.12);

  background: rgba(255,255,255,.03);

  cursor: pointer;
}


.irving-packages-close span {
  position: absolute;

  width: 15px;
  height: 1px;

  left: 50%;
  top: 50%;

  background: #fff;
}


.irving-packages-close span:first-child {
  transform: translate(-50%,-50%) rotate(45deg);
}


.irving-packages-close span:last-child {
  transform: translate(-50%,-50%) rotate(-45deg);
}


/* =========================================================
   VIEWS
========================================================= */

.irving-packages-view {
  height: calc(100% - 58px);

  overflow-y: auto;

  scrollbar-width: thin;
}


.irving-packages-view[hidden] {
  display: none !important;
}


/* =========================================================
   INTRO
========================================================= */

.irving-packages-intro {
  max-width: 1300px;

  margin: 0 auto;

  padding: 75px 7vw 55px;

  display: grid;

  grid-template-columns:
    minmax(0, 1.1fr)
    minmax(300px, .65fr);

  gap: 80px;

  border-bottom:
    1px solid rgba(255,255,255,.08);
}


.irving-packages-kicker {
  margin: 0 0 22px;

  font-size: 10px;

  letter-spacing: .18em;

  color: #999;
}


.irving-packages-kicker span {
  color: #22d3ee;

  margin-right: 10px;
}


.irving-packages-intro h2 {
  margin: 0;

  max-width: 750px;

  font-size: clamp(48px, 7vw, 96px);

  line-height: .92;

  letter-spacing: -.055em;

  font-weight: 600;
}


.irving-packages-intro h2 em {
  font-style: normal;

  background:
    linear-gradient(
      90deg,
      #8b5cf6,
      #22d3ee
    );

  -webkit-background-clip: text;
  background-clip: text;

  color: transparent;
}


.irving-packages-intro > p {
  align-self: end;

  max-width: 430px;

  margin: 0;

  color: #999;

  font-size: 15px;

  line-height: 1.8;
}


/* =========================================================
   PACKAGE GRID
========================================================= */

.irving-packages-grid {
  max-width: 1300px;

  margin: 0 auto;

  padding: 55px 7vw 80px;

  display: grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  gap: 14px;
}


/* =========================================================
   PACKAGE CARD
========================================================= */

.irving-package-card {
  position: relative;

  min-height: 330px;

  display: flex;
  flex-direction: column;

  text-align: left;

  padding: 30px;

  border:
    1px solid rgba(255,255,255,.09);

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.045),
      rgba(255,255,255,.015)
    );

  color: #fff;

  cursor: pointer;

  overflow: hidden;

  transition:
    transform .35s ease,
    border-color .35s ease,
    background .35s ease;
}


.irving-package-card::before {
  content: "";

  position: absolute;

  inset: 0;

  background:
    linear-gradient(
      135deg,
      rgba(139,92,246,.10),
      transparent 45%,
      rgba(34,211,238,.08)
    );

  opacity: 0;

  transition: opacity .35s ease;
}


.irving-package-card:hover {
  transform: translateY(-5px);

  border-color:
    rgba(139,92,246,.45);
}


.irving-package-card:hover::before {
  opacity: 1;
}


.irving-package-card.is-featured {
  border-color:
    rgba(139,92,246,.35);
}


.irving-package-card > * {
  position: relative;
  z-index: 1;
}


.irving-package-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;

  margin-bottom: 35px;
}


.irving-package-card-number {
  font-size: 11px;

  color: #22d3ee;

  letter-spacing: .15em;
}


.irving-package-card-category {
  font-size: 9px;

  color: #777;

  letter-spacing: .16em;
}


.irving-package-card-badge {
  display: inline-flex;

  align-self: flex-start;

  margin-bottom: 15px;

  padding: 6px 9px;

  border: 1px solid rgba(139,92,246,.35);

  color: #b99cff;

  font-size: 8px;

  font-weight: 700;

  letter-spacing: .15em;
}


.irving-package-card-name {
  display: block;

  margin-bottom: 14px;

  font-size: clamp(30px, 4vw, 48px);

  line-height: .95;

  letter-spacing: -.04em;

  font-weight: 600;
}


.irving-package-card-description {
  max-width: 500px;

  color: #929292;

  font-size: 14px;

  line-height: 1.7;
}


.irving-package-card-bottom {
  margin-top: auto;

  padding-top: 35px;

  display: flex;

  align-items: end;

  justify-content: space-between;

  color: #777;

  font-size: 9px;

  letter-spacing: .12em;
}


.irving-package-card-bottom strong {
  display: block;

  margin-top: 7px;

  color: #fff;

  font-size: 20px;

  letter-spacing: -.02em;
}


.irving-package-card-arrow {
  display: grid;

  place-items: center;

  width: 40px;
  height: 40px;

  border: 1px solid rgba(255,255,255,.12);

  font-size: 18px;

  transition:
    background .3s ease,
    border-color .3s ease;
}


.irving-package-card:hover
.irving-package-card-arrow {
  border-color: #8b5cf6;

  background: #8b5cf6;

  color: #fff;
}


/* =========================================================
   LIST FOOTER
========================================================= */

.irving-packages-list-footer {
  max-width: 1300px;

  margin: 0 auto;

  padding: 0 7vw 35px;

  display: flex;

  justify-content: space-between;

  font-size: 9px;

  letter-spacing: .15em;

  color: #666;
}


.irving-packages-list-footer i {
  display: inline-block;

  width: 5px;
  height: 5px;

  margin-right: 7px;

  border-radius: 50%;

  background: #22d3ee;
}


/* =========================================================
   DETAIL VIEW
========================================================= */

.irving-package-detail-view {
  padding: 0 7vw;
}


.irving-package-detail-header {
  max-width: 1300px;

  margin: 0 auto;

  padding: 28px 0;

  display: flex;

  align-items: center;

  justify-content: space-between;

  border-bottom:
    1px solid rgba(255,255,255,.08);
}


.irving-package-back {
  border: 0;

  background: none;

  color: #aaa;

  font-size: 10px;

  font-weight: 700;

  letter-spacing: .13em;

  cursor: pointer;
}


.irving-package-back:hover {
  color: #fff;
}


.irving-package-back span {
  margin-right: 10px;

  color: var(--purple);

  font-size: 17px;
}


.irving-package-detail-code {
  color: #666;

  font-size: 9px;

  letter-spacing: .15em;
}


.irving-package-detail-layout {
  max-width: 1300px;

  min-height: calc(100% - 150px);

  margin: 0 auto;

  padding: 80px 0;

  display: grid;

  grid-template-columns:
    minmax(0, 1.05fr)
    minmax(320px, .75fr);

  gap: 100px;
}


.irving-package-detail-category {
  margin: 0 0 18px;

  color: var(--purple);

  font-size: 9px;

  font-weight: 700;

  letter-spacing: .18em;
}


.irving-package-detail-number {
  color: #555;

  font-size: 13px;

  letter-spacing: .15em;

  margin-bottom: 15px;
}


.irving-package-detail-main h2 {
  max-width: 750px;

  margin: 0 0 25px;

  font-size: clamp(50px, 8vw, 105px);

  line-height: .87;

  letter-spacing: -.06em;
}


.irving-package-detail-description {
  max-width: 600px;

  color: #999;

  font-size: 17px;

  line-height: 1.7;
}


.irving-package-detail-price {
  margin-top: 55px;

  padding-top: 25px;

  border-top:
    1px solid rgba(255,255,255,.1);
}


.irving-package-detail-price span {
  display: block;

  margin-bottom: 8px;

  color: #666;

  font-size: 9px;

  letter-spacing: .15em;
}


.irving-package-detail-price strong {
  font-size: 40px;

  letter-spacing: -.04em;
}


.irving-package-start-button {
  margin-top: 35px;

  padding: 16px 20px;

  border: 1px solid transparent;

  background:
    linear-gradient(
      100deg,
      #8b5cf6,
      #22d3ee
    );

  color: #fff;

  font-size: 10px;

  font-weight: 700;

  letter-spacing: .13em;

  cursor: pointer;
}


.irving-package-start-button span {
  margin-left: 30px;

  font-size: 16px;
}


/* =========================================================
   DETAIL INFO
========================================================= */

.irving-package-info-block {
  padding: 25px 0;

  border-top:
    1px solid rgba(255,255,255,.1);
}


.irving-package-info-label {
  display: block;

  margin-bottom: 18px;

  color: #666;

  font-size: 9px;

  font-weight: 700;

  letter-spacing: .16em;
}


.irving-package-info-block > strong {
  color: #ddd;

  font-size: 14px;

  font-weight: 500;
}


.irving-package-best-for {
  display: flex;

  flex-wrap: wrap;

  gap: 7px;
}


.irving-package-best-for span {
  padding: 8px 10px;

  border: 1px solid rgba(255,255,255,.09);

  color: #aaa;

  font-size: 9px;

  letter-spacing: .08em;
}


.irving-package-features,
.irving-package-deliverables {
  list-style: none;

  padding: 0;

  margin: 0;
}


.irving-package-features li,
.irving-package-deliverables li {
  display: flex;

  gap: 12px;

  padding: 10px 0;

  color: #aaa;

  font-size: 13px;

  line-height: 1.5;

  border-bottom:
    1px solid rgba(255,255,255,.05);
}


.irving-package-features li span {
  color: #22d3ee;

  font-size: 9px;

  letter-spacing: .1em;
}


.irving-package-deliverables li span {
  color: #8b5cf6;

  font-weight: 700;
}


/* =========================================================
   DETAIL FOOTER
========================================================= */

.irving-package-detail-footer {
  max-width: 1300px;

  margin: 0 auto;

  padding: 20px 0 30px;

  display: flex;

  align-items: center;

  gap: 15px;

  color: #555;

  font-size: 8px;

  letter-spacing: .16em;
}


.irving-package-footer-line {
  flex: 1;

  height: 1px;

  background:
    rgba(255,255,255,.07);
}


/* =========================================================
   ERROR
========================================================= */

.irving-packages-error {
  grid-column: 1 / -1;

  padding: 50px;

  border: 1px solid rgba(255,255,255,.1);

  text-align: center;
}


.irving-packages-error span {
  color: #22d3ee;

  font-size: 10px;

  letter-spacing: .15em;
}


.irving-packages-error p {
  color: #777;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 650px) {

  .irving-packages-modal {
    top: 58px;
    right: 0;
    bottom: 64px;
    left: 0;

    width: 100vw;
    height: auto;

    z-index: 9000;
  }


  .irving-packages-panel {
    width: 100%;
    height: 100%;

    border-left: 0;
    border-right: 0;
    border-radius: 0;

    overflow: hidden;
  }


  .irving-packages-topbar {
    height: 56px;

    padding: 0 16px;
  }


  .irving-packages-view {
    height: calc(100% - 56px);

    overflow-y: auto;
    overflow-x: hidden;
  }


  .irving-packages-intro {

    display: block;

    padding: 42px 20px 35px;
  }


  .irving-packages-intro h2 {
    font-size: clamp(45px, 15vw, 70px);
  }


  .irving-packages-intro > p {
    margin-top: 28px;

    font-size: 13px;
  }


  .irving-packages-grid {

    grid-template-columns: 1fr;

    padding: 25px 16px 70px;

    gap: 10px;
  }


  .irving-package-card {

    min-height: 290px;

    padding: 24px;
  }


  .irving-package-card-name {
    font-size: 37px;
  }


  .irving-packages-list-footer {
    padding:
      0 20px 25px;

    gap: 15px;

    flex-direction: column;
  }


  /* DETAIL */

  .irving-package-detail-view {
    padding: 0 18px;
  }


  .irving-package-detail-header {
    padding: 18px 0;
  }


  .irving-package-detail-layout {

    display: block;

    padding: 42px 0 100px;
  }


  .irving-package-detail-main h2 {
    font-size: clamp(50px, 15vw, 76px);
  }


  .irving-package-detail-description {
    font-size: 14px;
  }


  .irving-package-detail-price {
    margin-top: 38px;
  }


  .irving-package-detail-price strong {
    font-size: 34px;
  }


  .irving-package-start-button {
    width: 100%;
  }


  .irving-package-detail-info {
    margin-top: 55px;
  }


  .irving-package-detail-footer {
    padding-bottom: 30px;

    flex-wrap: wrap;
  }


  .irving-package-footer-line {
    display: none;
  }

}


/* =========================================================
   SMALL PHONES
========================================================= */

@media (max-width: 400px) {

  .irving-packages-intro {
    padding-left: 17px;
    padding-right: 17px;
  }


  .irving-packages-grid {
    padding-left: 12px;
    padding-right: 12px;
  }


  .irving-package-card {
    padding: 20px;
  }


  .irving-package-card-name {
    font-size: 32px;
  }


  .irving-package-detail-view {
    padding-left: 16px;
    padding-right: 16px;
  }

}
/* =========================================================
   IRVING STUDIO — UNIFIED MODAL DESIGN SYSTEM
   ---------------------------------------------------------
   Applies to:
   01  Project Intake
   02  Packages
   AI  irvingAI

   Visual language:
   VANTA / BLUEPRINT / DIGITAL SYSTEM
   ========================================================= */


/* =========================================================
   01. SHARED MODAL TOKENS
   ========================================================= */

:root {

  --irving-modal-accent: #6048e5;
  --irving-modal-accent-2: #7c3aed;
  --irving-modal-accent-bright: #8b5cf6;
  --irving-modal-accent-soft: #a78bfa;

  --irving-modal-light-bg: #f7f7fb;
  --irving-modal-light-surface: #ffffff;
  --irving-modal-light-ink: #111116;
  --irving-modal-light-muted: rgba(17,17,22,.58);
  --irving-modal-light-line: rgba(17,17,22,.10);

  --irving-modal-dark-bg: #0b0b12;
  --irving-modal-dark-surface: #101018;
  --irving-modal-dark-ink: #ffffff;
  --irving-modal-dark-muted: rgba(255,255,255,.52);
  --irving-modal-dark-line: rgba(255,255,255,.09);

  --irving-modal-radius: 24px;

  --irving-modal-grid-size: 44px;

  --irving-modal-transition:
    .35s cubic-bezier(.16,1,.3,1);
}


/* =========================================================
   02. SHARED TYPOGRAPHY
   ========================================================= */

.irving-intake-project-modal,
.irving-packages-modal,
.irving-ai {

  font-family:
    "DM Sans",
    Arial,
    sans-serif;

  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}


/* =========================================================
   03. SHARED TECHNICAL GRID
   ========================================================= */

.irving-intake-project-panel,
.irving-packages-panel,
.irving-ai-panel {

  background-image:
    linear-gradient(
      rgba(96,72,229,.045) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(96,72,229,.045) 1px,
      transparent 1px
    );

  background-size:
    var(--irving-modal-grid-size)
    var(--irving-modal-grid-size);

}


/* =========================================================
   04. DARK MODE BASE
   ========================================================= */

body.dark .irving-intake-project-panel,
body.dark .irving-packages-panel,
body.dark .irving-ai-panel,

[data-theme="dark"] .irving-intake-project-panel,
[data-theme="dark"] .irving-packages-panel,
[data-theme="dark"] .irving-ai-panel,

html[data-theme="dark"] .irving-intake-project-panel,
html[data-theme="dark"] .irving-packages-panel,
html[data-theme="dark"] .irving-ai-panel {

  --modal-bg: var(--irving-modal-dark-bg);
  --modal-surface: var(--irving-modal-dark-surface);
  --modal-ink: var(--irving-modal-dark-ink);
  --modal-muted: var(--irving-modal-dark-muted);
  --modal-line: var(--irving-modal-dark-line);

  color: var(--modal-ink);

  background-color:
    var(--irving-modal-dark-bg);

  background-image:
    radial-gradient(
      circle at 50% 25%,
      rgba(96,72,229,.075),
      transparent 42%
    ),
    linear-gradient(
      rgba(255,255,255,.025) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255,255,255,.025) 1px,
      transparent 1px
    );

  background-size:
    auto,
    var(--irving-modal-grid-size)
    var(--irving-modal-grid-size),
    var(--irving-modal-grid-size)
    var(--irving-modal-grid-size);

}


/* =========================================================
   05. LIGHT MODE BASE
   ========================================================= */

body:not(.dark):not([data-theme="dark"])
.irving-intake-project-panel,

body:not(.dark):not([data-theme="dark"])
.irving-packages-panel,

body:not(.dark):not([data-theme="dark"])
.irving-ai-panel,

body.light .irving-intake-project-panel,
body.light .irving-packages-panel,
body.light .irving-ai-panel,

[data-theme="light"] .irving-intake-project-panel,
[data-theme="light"] .irving-packages-panel,
[data-theme="light"] .irving-ai-panel,

html[data-theme="light"] .irving-intake-project-panel,
html[data-theme="light"] .irving-packages-panel,
html[data-theme="light"] .irving-ai-panel {

  --modal-bg: var(--irving-modal-light-bg);
  --modal-surface: var(--irving-modal-light-surface);
  --modal-ink: var(--irving-modal-light-ink);
  --modal-muted: var(--irving-modal-light-muted);
  --modal-line: var(--irving-modal-light-line);

  color: var(--modal-ink);

  background-color:
    var(--irving-modal-light-bg);

  background-image:
    radial-gradient(
      circle at 50% 25%,
      rgba(96,72,229,.055),
      transparent 42%
    ),
    linear-gradient(
      rgba(96,72,229,.045) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(96,72,229,.045) 1px,
      transparent 1px
    );

  background-size:
    auto,
    var(--irving-modal-grid-size)
    var(--irving-modal-grid-size),
    var(--irving-modal-grid-size)
    var(--irving-modal-grid-size);

}


/* =========================================================
   06. SHARED MODAL BACKDROP
   ========================================================= */

.irving-intake-project-modal-backdrop,
.irving-packages-backdrop {

  background:
    radial-gradient(
      circle at 50% 35%,
      rgba(96,72,229,.12),
      transparent 42%
    ),
    rgba(5,5,10,.76);

  backdrop-filter:
    blur(18px);

  -webkit-backdrop-filter:
    blur(18px);

}


/* =========================================================
   07. SHARED PANEL BORDER
   ========================================================= */

.irving-intake-project-panel,
.irving-packages-panel,
.irving-ai-panel {

  border-color:
    rgba(96,72,229,.16);

  box-shadow:
    0 35px 100px rgba(0,0,0,.28),
    0 0 80px rgba(96,72,229,.08);

}


/* DARK PANEL BORDER */

body.dark .irving-intake-project-panel,
body.dark .irving-packages-panel,
body.dark .irving-ai-panel,

[data-theme="dark"] .irving-intake-project-panel,
[data-theme="dark"] .irving-packages-panel,
[data-theme="dark"] .irving-ai-panel {

  border-color:
    rgba(167,139,250,.16);

  box-shadow:
    0 40px 120px rgba(0,0,0,.55),
    0 0 100px rgba(96,72,229,.12);

}


/* =========================================================
   08. TECHNICAL PURPLE EDGE
   ========================================================= */

.irving-intake-project-panel::before,
.irving-packages-panel::before,
.irving-ai-panel::before {

  content: "";

  position: absolute;

  top: 0;
  left: 0;

  width: 180px;
  height: 2px;

  background:
    linear-gradient(
      90deg,
      var(--irving-modal-accent-2),
      var(--irving-modal-accent),
      transparent
    );

  pointer-events: none;

}


/* =========================================================
   09. SHARED STATUS DOT
   ========================================================= */

.irving-intake-project-status-dot,
.irving-packages-status-dot,
.irving-ai-status-dot {

  width: 7px;
  height: 7px;

  flex: 0 0 7px;

  border-radius: 50%;

  background:
    var(--irving-modal-accent-bright);

  box-shadow:
    0 0 0 4px rgba(139,92,246,.08),
    0 0 16px rgba(139,92,246,.55);

}


/* =========================================================
   10. SHARED SYSTEM LABELS
   ========================================================= */

.irving-intake-project-system-id,
.irving-packages-system-id,
.irving-ai-system-id {

  font-size: 10px;

  font-weight: 700;

  letter-spacing: .16em;

  text-transform: uppercase;

  color:
    var(--modal-muted);

}


/* SYSTEM CODES */

.irving-intake-project-system-code,
.irving-packages-system-code {

  margin-left: 10px;

  color:
    rgba(96,72,229,.65);

}


/* DARK */

body.dark .irving-intake-project-system-code,
body.dark .irving-packages-system-code,

[data-theme="dark"] .irving-intake-project-system-code,
[data-theme="dark"] .irving-packages-system-code {

  color:
    var(--irving-modal-accent-soft);

}


/* =========================================================
   11. SHARED CLOSE BUTTON LANGUAGE
   ========================================================= */

.irving-intake-project-modal-close,
.irving-packages-close {

  width: 36px;
  height: 36px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  border: 1px solid var(--modal-line);

  border-radius: 50%;

  background: transparent;

  color: var(--modal-ink);

  transition:
    border-color .25s ease,
    background .25s ease,
    transform .25s ease;

}


.irving-intake-project-modal-close:hover,
.irving-packages-close:hover {

  border-color:
    rgba(96,72,229,.55);

  background:
    rgba(96,72,229,.07);

  transform: rotate(4deg);

}


/* =========================================================
   12. PROJECT INTAKE — LIGHT MODE
   ========================================================= */

body:not(.dark) .irving-intake-project-panel-intro h2,
[data-theme="light"] .irving-intake-project-panel-intro h2 {

  color:
    var(--irving-modal-light-ink);

}


body:not(.dark) .irving-intake-project-intro-copy,
[data-theme="light"] .irving-intake-project-intro-copy {

  color:
    var(--irving-modal-light-muted);

}


body:not(.dark) .irving-intake-project-field input,
body:not(.dark) .irving-intake-project-field textarea,
body:not(.dark) .irving-intake-project-field select,

[data-theme="light"] .irving-intake-project-field input,
[data-theme="light"] .irving-intake-project-field textarea,
[data-theme="light"] .irving-intake-project-field select {

  color:
    var(--irving-modal-light-ink);

  border-color:
    rgba(17,17,22,.13);

}


body:not(.dark) .irving-intake-project-field input:focus,
body:not(.dark) .irving-intake-project-field textarea:focus,
body:not(.dark) .irving-intake-project-field select:focus,

[data-theme="light"] .irving-intake-project-field input:focus,
[data-theme="light"] .irving-intake-project-field textarea:focus,
[data-theme="light"] .irving-intake-project-field select:focus {

  border-color:
    var(--irving-modal-accent);

}


/* =========================================================
   13. PACKAGES — REMOVE CYAN
   ========================================================= */

/*
   The existing Packages modal uses #22d3ee in several places.
   That is what makes it look like a different product.

   Replace the cyan visual language with Irving purple.
*/

.irving-packages-kicker span,
.irving-package-features li span,
.irving-packages-error span {

  color:
    var(--irving-modal-accent-bright) !important;

}


.irving-packages-intro h2 em {

  background:
    linear-gradient(
      90deg,
      var(--irving-modal-accent),
      var(--irving-modal-accent-bright)
    );

  -webkit-background-clip: text;
  background-clip: text;

  -webkit-text-fill-color: transparent;

}


.irving-package-deliverables li span {

  color:
    var(--irving-modal-accent-bright) !important;

}


/* PACKAGE CARD */

.irving-package-card {

  border-color:
    var(--modal-line);

  background:
    var(--modal-surface);

  transition:
    transform .35s ease,
    border-color .35s ease,
    box-shadow .35s ease,
    background .35s ease;

}


.irving-package-card:hover {

  border-color:
    rgba(96,72,229,.42);

  box-shadow:
    0 18px 50px rgba(96,72,229,.08);

}


/* FEATURED PACKAGE */

.irving-package-card-featured,
.irving-package-card.is-featured {

  background:
    linear-gradient(
      145deg,
      rgba(96,72,229,.08),
      transparent 65%
    ),
    var(--modal-surface);

}


/* =========================================================
   14. PACKAGE DETAIL ACCENTS
   ========================================================= */

.irving-package-detail-price strong,
.irving-package-detail-main h2 em {

  color:
    var(--irving-modal-accent);

}


.irving-package-detail-view {

  color:
    var(--modal-ink);

}


.irving-package-detail-description,
.irving-package-detail-info,
.irving-package-detail-footer {

  color:
    var(--modal-muted);

}


/* =========================================================
   15. IRVING AI — SAME SYSTEM
   ========================================================= */

.irving-ai-panel {

  border-radius:
    var(--irving-modal-radius);

  background-color:
    var(--modal-bg);

}


/* AI HEADER */

.irving-ai-header {

  border-bottom:
    1px solid var(--modal-line);

  background:
    rgba(255,255,255,.018);

}


/* AI LOGO */

.irving-ai-logo {

  border-color:
    rgba(139,92,246,.40) !important;

  background:
    rgba(96,72,229,.08) !important;

  box-shadow:
    0 0 22px rgba(96,72,229,.10);

}


.irving-ai-logo span {

  background:
    var(--irving-modal-accent-bright) !important;

  box-shadow:
    0 0 12px rgba(139,92,246,.55);

}


/* AI NAME */

.irving-ai-name {

  color:
    var(--modal-ink);

}


/* AI SECONDARY LABELS */

.irving-ai-status,
.irving-ai-subtitle,
.irving-ai-footer {

  color:
    var(--modal-muted);

}


/* =========================================================
   16. AI QUICK ACTIONS
   ========================================================= */

.irving-ai-quick {

  border:
    1px solid var(--modal-line);

  background:
    rgba(96,72,229,.025);

  color:
    var(--modal-ink);

  transition:
    border-color .25s ease,
    background .25s ease,
    transform .25s ease;

}


.irving-ai-quick:hover {

  border-color:
    rgba(96,72,229,.42);

  background:
    rgba(96,72,229,.07);

  transform:
    translateX(2px);

}


/* AI QUICK ICONS */

.irving-ai .quick-icon {

  color:
    var(--irving-modal-accent-bright);

}


.irving-ai .quick-icon svg {

  stroke:
    currentColor;

}


/* =========================================================
   17. AI MESSAGE AREA
   ========================================================= */

.irving-ai-messages {

  background:
    transparent;

}


.irving-ai-message {

  color:
    var(--modal-ink);

}


/* AI USER MESSAGE */

.irving-ai-message.user {

  background:
    rgba(96,72,229,.10);

  border:
    1px solid rgba(96,72,229,.16);

}


/* AI RESPONSE */

.irving-ai-message.assistant {

  background:
    rgba(255,255,255,.025);

  border:
    1px solid var(--modal-line);

}


/* =========================================================
   18. AI INPUT
   ========================================================= */

.irving-ai-input-area {

  border:
    1px solid var(--modal-line);

  background:
    rgba(96,72,229,.025);

}


.irving-ai-input-area:focus-within {

  border-color:
    rgba(96,72,229,.45);

  box-shadow:
    0 0 0 3px rgba(96,72,229,.06);

}


.irving-ai-input-area textarea {

  color:
    var(--modal-ink);

}


.irving-ai-input-area textarea::placeholder {

  color:
    var(--modal-muted);

}


/* SEND BUTTON */

.irving-ai-send {

  background:
    linear-gradient(
      135deg,
      var(--irving-modal-accent-bright),
      var(--irving-modal-accent)
    );

  box-shadow:
    0 8px 22px rgba(96,72,229,.20);

}


/* =========================================================
   19. AI TYPING INDICATOR
   ========================================================= */

.irving-ai-typing span {

  background:
    var(--irving-modal-accent-bright);

}


/* =========================================================
   20. MOBILE — ONE CONSISTENT MODAL SYSTEM
   ========================================================= */

@media (max-width: 650px) {

  .irving-intake-project-modal,
  .irving-packages-modal {

    top: 57px !important;
    right: 0 !important;
    bottom: 64px !important;
    left: 0 !important;

    width: 100vw !important;
    height: auto !important;

    padding: 0 !important;

  }


  .irving-intake-project-panel,
  .irving-packages-panel {

    width: 100% !important;
    height: 100% !important;

    max-height: none !important;

    border-radius: 0 !important;

    border-left: 0 !important;
    border-right: 0 !important;

  }


  .irving-intake-project-panel,
  .irving-packages-panel,
  .irving-ai-panel {

    background-size:
      32px 32px,
      32px 32px,
      32px 32px;

  }


  .irving-intake-project-panel-top,
  .irving-packages-topbar {

    min-height: 56px;

    height: 56px;

    padding:
      0 18px;

  }


  .irving-intake-project-panel-footer {

    border-color:
      var(--modal-line);

  }


  .irving-ai-panel {

    width:
      min(
        calc(100vw - 20px),
        410px
      ) !important;

    max-width:
      calc(100vw - 20px) !important;

    border-radius:
      20px !important;

  }

}


/* =========================================================
   21. SMALL PHONE
   ========================================================= */

@media (max-width: 400px) {

  .irving-intake-project-panel-top,
  .irving-packages-topbar {

    padding:
      0 15px;

  }


  .irving-intake-project-system-id,
  .irving-packages-system-id {

    font-size:
      8px;

  }


  .irving-ai-panel {

    right:
      10px !important;

    width:
      calc(100vw - 20px) !important;

  }

}


/* =========================================================
   22. REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .irving-intake-project-modal *,
  .irving-packages-modal *,
  .irving-ai * {

    animation-duration:
      .001ms !important;

    animation-iteration-count:
      1 !important;

    transition-duration:
      .001ms !important;

  }

}
/* =========================================================
   IRVING STUDIO — TOPBAR THEME FIX
   ---------------------------------------------------------
   IMPORTANT:
   Light mode = body WITHOUT .dark
   Dark mode  = body WITH .dark
   ========================================================= */


/* =========================================================
   LIGHT MODE
   ========================================================= */

body:not(.dark) .irving-packages-topbar,
body:not(.dark) .irving-intake-project-panel-top {

  background:
    linear-gradient(
      90deg,
      rgba(96, 72, 229, 0.045),
      rgba(124, 58, 237, 0.025),
      rgba(255, 255, 255, 0.96)
    ) !important;

  color: #111116 !important;

  border-bottom:
    1px solid rgba(17, 17, 22, 0.10) !important;

  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 8px 30px rgba(17, 17, 22, 0.035) !important;
}


/* ---------------------------------------------------------
   LIGHT MODE — TOPBAR CONTENT
--------------------------------------------------------- */

body:not(.dark) .irving-packages-topbar *,
body:not(.dark) .irving-intake-project-panel-top * {

  color: inherit;
}


/* ---------------------------------------------------------
   LIGHT MODE — SYSTEM ID
--------------------------------------------------------- */

body:not(.dark) .irving-packages-system-id,
body:not(.dark) .irving-intake-project-system-id {

  color: #6048e5 !important;
}


/* ---------------------------------------------------------
   LIGHT MODE — SYSTEM CODE
--------------------------------------------------------- */

body:not(.dark) .irving-packages-system-code,
body:not(.dark) .irving-intake-project-system-code {

  color: rgba(17, 17, 22, 0.42) !important;
}


/* ---------------------------------------------------------
   LIGHT MODE — STATUS DOT
--------------------------------------------------------- */

body:not(.dark) .irving-packages-status-dot,
body:not(.dark) .irving-intake-project-status-dot {

  background: #6048e5 !important;

  box-shadow:
    0 0 0 4px rgba(96, 72, 229, 0.08),
    0 0 14px rgba(96, 72, 229, 0.30) !important;
}


/* ---------------------------------------------------------
   LIGHT MODE — CLOSE BUTTON
--------------------------------------------------------- */

body:not(.dark) .irving-packages-close,
body:not(.dark) .irving-intake-project-modal-close {

  background: rgba(17, 17, 22, 0.035) !important;

  border:
    1px solid rgba(17, 17, 22, 0.10) !important;

  color: #111116 !important;
}


body:not(.dark) .irving-packages-close:hover,
body:not(.dark) .irving-intake-project-modal-close:hover {

  background:
    rgba(96, 72, 229, 0.08) !important;

  border-color:
    rgba(96, 72, 229, 0.25) !important;

  color:
    #6048e5 !important;
}


/* =========================================================
   LIGHT MODE — PURPLE TECHNICAL EDGE
========================================================= */

body:not(.dark) .irving-packages-panel::before,
body:not(.dark) .irving-intake-project-panel::before {

  background:
    linear-gradient(
      90deg,
      #6048e5,
      #7c3aed,
      rgba(124, 58, 237, 0)
    ) !important;
}


/* =========================================================
   DARK MODE
   Keep the existing Irving technical dark appearance
========================================================= */

body.dark .irving-packages-topbar,
body.dark .irving-intake-project-panel-top {

  background:
    linear-gradient(
      90deg,
      rgba(96, 72, 229, 0.08),
      rgba(124, 58, 237, 0.035),
      rgba(11, 11, 18, 0.96)
    ),
    #0b0b12 !important;

  color: #f4f4f5 !important;

  border-bottom:
    1px solid rgba(255, 255, 255, 0.08) !important;

  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.025) inset,
    0 12px 40px rgba(0, 0, 0, 0.22) !important;
}


/* ---------------------------------------------------------
   DARK MODE — TOPBAR CONTENT
--------------------------------------------------------- */

body.dark .irving-packages-topbar *,
body.dark .irving-intake-project-panel-top * {

  color: inherit;
}


/* ---------------------------------------------------------
   DARK MODE — SYSTEM ID
--------------------------------------------------------- */

body.dark .irving-packages-system-id,
body.dark .irving-intake-project-system-id {

  color: rgba(255, 255, 255, 0.72) !important;
}


/* ---------------------------------------------------------
   DARK MODE — SYSTEM CODE
--------------------------------------------------------- */

body.dark .irving-packages-system-code,
body.dark .irving-intake-project-system-code {

  color: rgba(255, 255, 255, 0.28) !important;
}


/* ---------------------------------------------------------
   DARK MODE — CLOSE BUTTON
--------------------------------------------------------- */

body.dark .irving-packages-close,
body.dark .irving-intake-project-modal-close {

  background: transparent !important;

  border:
    1px solid rgba(255, 255, 255, 0.08) !important;

  color: #ffffff !important;
}


/* =========================================================
   DARK MODE — PURPLE TECHNICAL EDGE
========================================================= */

body.dark .irving-packages-panel::before,
body.dark .irving-intake-project-panel::before {

  background:
    linear-gradient(
      90deg,
      #7c3aed,
      #8b5cf6,
      rgba(139, 92, 246, 0)
    ) !important;
}
/* =========================================================
   IRVING STUDIO — FINAL LIGHT MODE CONTRAST FIX
   ---------------------------------------------------------
   Fixes remaining white text/icons inside:
   PROJECT INTAKE + PACKAGES
   ========================================================= */


/* =========================================================
   01. PROJECT INTAKE — KICKER
   ========================================================= */

body:not(.dark) .irving-intake-project-kicker {
  color: #6048e5 !important;
}


/* If the kicker contains child spans */
body:not(.dark) .irving-intake-project-kicker span {
  color: inherit !important;
}


/* =========================================================
   02. PROJECT INTAKE — "SYSTEM READY"
   ========================================================= */

body:not(.dark) .irving-intake-project-submit-meta {
  color: #52525b !important;
}

body:not(.dark) .irving-intake-project-submit-meta span {
  color: inherit !important;
}


/* Keep the status dot purple */
body:not(.dark) .irving-intake-project-submit-meta
.irving-intake-project-status-dot {
  background: #7c3aed !important;

  box-shadow:
    0 0 0 3px rgba(124,58,237,.10),
    0 0 14px rgba(124,58,237,.28) !important;
}


/* =========================================================
   03. PROJECT INTAKE — CLOSE BUTTON
   ---------------------------------------------------------
   The original CSS puts white directly on the X spans.
   Changing only the button color therefore isn't enough.
   ========================================================= */

body:not(.dark) .irving-intake-project-modal-close {
  color: #18181b !important;

  background:
    rgba(17,17,22,.035) !important;

  border:
    1px solid rgba(17,17,22,.10) !important;
}


/* THE ACTUAL X LINES */
body:not(.dark) .irving-intake-project-modal-close span {
  background:
    currentColor !important;
}


/* Hover */
body:not(.dark) .irving-intake-project-modal-close:hover {
  color: #6048e5 !important;

  background:
    rgba(96,72,229,.08) !important;

  border-color:
    rgba(96,72,229,.25) !important;
}


/* =========================================================
   04. PACKAGES — PACKAGE NAME
   ========================================================= */

body:not(.dark) .irving-package-card-name {
  color: #111116 !important;
}


/* Catch nested elements if any */
body:not(.dark) .irving-package-card-name * {
  color: inherit !important;
}


/* =========================================================
   05. PACKAGES — PRICE
   ---------------------------------------------------------
   Fixes:
   <strong>R6,000</strong>
   ========================================================= */

body:not(.dark) .irving-package-card-bottom strong {
  color: #111116 !important;
}


/* =========================================================
   06. PACKAGES — CARD BOTTOM LABELS
   ========================================================= */

body:not(.dark) .irving-package-card-bottom {
  color: #66666f !important;
}

body:not(.dark) .irving-package-card-bottom span,
body:not(.dark) .irving-package-card-bottom small {
  color: inherit !important;
}


/* =========================================================
   07. PACKAGES — CLOSE BUTTON
   ---------------------------------------------------------
   The original CSS has:
   .irving-packages-close span {
     background: #fff;
   }
   So we explicitly fix the X itself.
   ========================================================= */

body:not(.dark) .irving-packages-close {
  color: #18181b !important;

  background:
    rgba(17,17,22,.035) !important;

  border:
    1px solid rgba(17,17,22,.10) !important;
}


/* THE ACTUAL X LINES */
body:not(.dark) .irving-packages-close span {
  background:
    currentColor !important;
}


/* Hover */
body:not(.dark) .irving-packages-close:hover {
  color: #6048e5 !important;

  background:
    rgba(96,72,229,.08) !important;

  border-color:
    rgba(96,72,229,.25) !important;
}


/* =========================================================
   08. PACKAGES — CARD ARROW
   ========================================================= */

body:not(.dark) .irving-package-card-arrow {
  color: #111116 !important;

  border-color:
    rgba(17,17,22,.12) !important;

  background:
    rgba(17,17,22,.025) !important;
}


/* Hover */
body:not(.dark) .irving-package-card:hover
.irving-package-card-arrow {
  color: #ffffff !important;

  background:
    #6048e5 !important;

  border-color:
    #6048e5 !important;
}


/* =========================================================
   09. PACKAGES — CARD NUMBER
   ---------------------------------------------------------
   Removes the old cyan and keeps the Irving purple system.
   ========================================================= */

body:not(.dark) .irving-package-card-number {
  color: #6048e5 !important;
}


/* =========================================================
   10. PACKAGES — BADGE
   ========================================================= */

body:not(.dark) .irving-package-card-badge {
  color: #6048e5 !important;

  border-color:
    rgba(96,72,229,.25) !important;

  background:
    rgba(96,72,229,.045) !important;
}


/* =========================================================
   11. PACKAGES — DESCRIPTION
   ========================================================= */

body:not(.dark) .irving-package-card-description {
  color: #5f6068 !important;
}


/* =========================================================
   12. PACKAGES — CATEGORY
   ========================================================= */

body:not(.dark) .irving-package-card-category {
  color: #66666f !important;
}


/* =========================================================
   13. PACKAGE CARD BORDER / SURFACE
   ---------------------------------------------------------
   Makes sure the cards themselves also behave as light cards.
   ========================================================= */

body:not(.dark) .irving-package-card {
  color: #111116 !important;

  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.98),
      rgba(248,248,252,.94)
    ) !important;

  border-color:
    rgba(17,17,22,.10) !important;

  box-shadow:
    0 12px 40px rgba(17,17,22,.045) !important;
}


/* Featured card */
body:not(.dark) .irving-package-card.is-featured {
  border-color:
    rgba(96,72,229,.28) !important;
}


/* =========================================================
   14. PACKAGE CARD HOVER
   ========================================================= */

body:not(.dark) .irving-package-card:hover {
  border-color:
    rgba(96,72,229,.40) !important;

  box-shadow:
    0 20px 55px rgba(96,72,229,.10) !important;
}


/* =========================================================
   15. PACKAGE CARD GLOW
   ---------------------------------------------------------
   Remove the old cyan glow from light mode.
   ========================================================= */

body:not(.dark) .irving-package-card::before {
  background:
    linear-gradient(
      135deg,
      rgba(96,72,229,.07),
      transparent 48%,
      rgba(124,58,237,.035)
    ) !important;
}


/* =========================================================
   16. PACKAGE LIST FOOTER
   ========================================================= */

body:not(.dark) .irving-packages-list-footer {
  color: #66666f !important;
}


/* Footer status dot */
body:not(.dark) .irving-packages-list-footer i {
  background:
    #6048e5 !important;
}


/* =========================================================
   17. PACKAGE DETAIL BACK BUTTON
   ========================================================= */

body:not(.dark) .irving-package-back {
  color: #55565f !important;
}

body:not(.dark) .irving-package-back:hover {
  color: #6048e5 !important;
}


/* =========================================================
   18. PACKAGE DETAIL HEADER
   ========================================================= */

body:not(.dark) .irving-package-detail-header {
  border-bottom-color:
    rgba(17,17,22,.10) !important;
}


/* =========================================================
   19. EXTRA SAFETY — REMOVE HARD-CODED WHITE FROM
       PACKAGE CONTENT IN LIGHT MODE
   ---------------------------------------------------------
   Only targets normal text elements, NOT buttons.
   ========================================================= */

body:not(.dark) .irving-package-card h1,
body:not(.dark) .irving-package-card h2,
body:not(.dark) .irving-package-card h3,
body:not(.dark) .irving-package-card p,
body:not(.dark) .irving-package-card label {
  color: #111116;
}


/* Re-apply muted text where needed */
body:not(.dark) .irving-package-card-description,
body:not(.dark) .irving-package-card-category,
body:not(.dark) .irving-package-card-bottom {
  color: #5f6068 !important;
}


/* Price must remain strong */
body:not(.dark) .irving-package-card-bottom strong {
  color: #111116 !important;
}


/* =========================================================
   END — LIGHT MODE CONTRAST FIX
   ========================================================= */
   /* =========================================================
   IRVING AI — REMOVE MOBILE BORDER RADIUS
   ========================================================= */

@media (max-width: 650px) {

  .irving-ai-panel {
    border-radius: 0 !important;
  }

  .irving-ai-panel,
  .irving-ai-panel::before,
  .irving-ai-panel::after {
    border-radius: 0 !important;
  }

}
/* =========================================================
   IRVING STUDIO — PREMIUM TOP ACCENT
   FINAL LAYER FIX
   ========================================================= */

.irving-intake-project-panel,
.irving-packages-panel,
.irving-ai-panel {
    position: relative !important;
}

/* Premium purple line */
.irving-intake-project-panel::before,
.irving-packages-panel::before,
.irving-ai-panel::before {
    content: "" !important;

    position: absolute !important;
    top: 0 !important;
    left: 0 !important;

    width: 180px !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7c3aed 0%,
            #8b5cf6 45%,
            #6048e5 70%,
            transparent 100%
        ) !important;

    display: block !important;

    opacity: 1 !important;

    pointer-events: none !important;

    z-index: 9999 !important;
}

/* Dark mode — slightly brighter premium edge */
body.dark .irving-intake-project-panel::before,
body.dark .irving-packages-panel::before,
body.dark .irving-ai-panel::before,
[data-theme="dark"] .irving-intake-project-panel::before,
[data-theme="dark"] .irving-packages-panel::before,
[data-theme="dark"] .irving-ai-panel::before {
    background:
        linear-gradient(
            90deg,
            #7c3aed 0%,
            #8b5cf6 45%,
            #a78bfa 70%,
            transparent 100%
        ) !important;

    box-shadow:
        0 0 12px rgba(139, 92, 246, .35) !important;
}

/* Keep the accent above the sticky package header */
.irving-packages-topbar,
.irving-intake-project-panel-top,
.irving-ai-header {
    position: relative;
}

/* Mobile */
@media (max-width: 650px) {

    .irving-intake-project-panel::before,
    .irving-packages-panel::before,
    .irving-ai-panel::before {
        width: 140px !important;
        height: 3px !important;
    }

}
/* =========================================================
   IRVING STUDIO — PROJECT INTAKE
   CORRECT STICKY HEADER SYSTEM
   ========================================================= */

/* ---------------------------------------------------------
   MAIN PANEL
   The panel is the ONLY scrolling container.
--------------------------------------------------------- */

.irving-intake-project-panel {
    position: relative !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    max-height: calc(100vh - 60px) !important;
}


/* ---------------------------------------------------------
   TOP SYSTEM BAR
   ONLY THIS ELEMENT STAYS AT THE TOP
--------------------------------------------------------- */

.irving-intake-project-panel-top {
    position: sticky !important;

    top: 0 !important;

    z-index: 1000 !important;

    min-height: 64px !important;

    background:
        rgba(11, 11, 18, 0.96) !important;

    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
}


/* ---------------------------------------------------------
   PURPLE PREMIUM ACCENT
   ATTACHED TO THE TOP BAR
--------------------------------------------------------- */

.irving-intake-project-panel-top::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 180px !important;
    height: 3px !important;

    background:
        linear-gradient(
            90deg,
            #7c3aed 0%,
            #8b5cf6 45%,
            #6048e5 70%,
            transparent 100%
        ) !important;

    opacity: 1 !important;

    pointer-events: none !important;

    z-index: 1001 !important;

    box-shadow:
        0 0 12px rgba(139, 92, 246, 0.35);
}


/* ---------------------------------------------------------
   MAKE SURE CONTENT IS NOT STICKY
--------------------------------------------------------- */

.irving-intake-project-panel-content,
.irving-intake-project-panel-intro,
.irving-intake-project-panel-form {
    position: relative !important;

    top: auto !important;
    bottom: auto !important;

    z-index: 1 !important;
}


/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media (max-width: 600px) {

    .irving-intake-project-panel {
        width: 100% !important;

        /* IMPORTANT:
           The parent modal already defines the available height.
           Do NOT use 100vh here.
        */
        height: 100% !important;
        min-height: 0 !important;
        max-height: 100% !important;

        overflow-y: auto !important;
        overflow-x: hidden !important;

        box-sizing: border-box !important;

        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }
}
/* =========================================================
   IRVING STUDIO — PACKAGE SVG ARROWS
   Prevent iOS/Safari Unicode arrow emoji conversion
========================================================= */

.irving-package-card-arrow,
.irving-package-back-arrow,
.irving-package-start-arrow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  line-height: 0 !important;
}

.irving-package-card-arrow svg,
.irving-package-back-arrow svg,
.irving-package-start-arrow svg {
  display: block !important;
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  color: currentColor !important;
}

.irving-package-card-arrow svg path,
.irving-package-back-arrow svg path,
.irving-package-start-arrow svg path {
  vector-effect: non-scaling-stroke;
}



/* =====================================================
   IRVING STUDIO — PREMIUM SCROLL MOTION
===================================================== */

:root {
  --irving-motion-ease: cubic-bezier(.16, 1, .3, 1);
  --irving-motion-duration: 850ms;
  --irving-accent: #8b5cf6;
}

/* Elements reveal as they enter the viewport */
.irving-reveal {
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  transition:
    opacity var(--irving-motion-duration) ease,
    transform var(--irving-motion-duration)
      var(--irving-motion-ease);
  will-change: opacity, transform;
}

.irving-reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* Reveal from the left */
.irving-reveal-left {
  opacity: 0;
  transform: translate3d(-24px, 0, 0);
  transition:
    opacity 800ms ease,
    transform 900ms var(--irving-motion-ease);
}

.irving-reveal-left.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* Reveal from the right */
.irving-reveal-right {
  opacity: 0;
  transform: translate3d(24px, 0, 0);
  transition:
    opacity 800ms ease,
    transform 900ms var(--irving-motion-ease);
}

.irving-reveal-right.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

/* Stagger child elements */
.irving-stagger > * {
  transition-delay: var(--irving-stagger-delay, 0ms);
}

/* Fine section divider */
.irving-scroll-divider {
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 1000ms var(--irving-motion-ease);
}

.irving-scroll-divider.is-visible {
  transform: scaleX(1);
}

/* Scroll progress indicator */
.irving-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  z-index: 100000;
  pointer-events: none;
  transform: scaleX(0);
  transform-origin: left center;
  background: linear-gradient(
    90deg,
    #6048e5,
    #8b5cf6,
    #c4b5fd
  );
}

/* Respect accessibility preferences */
@media (prefers-reduced-motion: reduce) {
  .irving-reveal,
  .irving-reveal-left,
  .irving-reveal-right,
  .irving-scroll-divider,
  .irving-stagger > * {
    opacity: 1;
    transform: none;
    transition: none;
    animation: none;
    will-change: auto;
  }

  .irving-scroll-progress {
    display: none;
  }
}









/* =========================================================
   IRVING STUDIO — SCROLL MOTION SYSTEM
   Slide • Reveal • Assemble • Depth
========================================================= */

:root {
  --irving-motion-duration: 850ms;
  --irving-motion-ease: cubic-bezier(.16, 1, .3, 1);
}

/* Keep animations from causing horizontal overflow */
html {
  overflow-x: clip;
}

body {
  overflow-x: clip;
}

/* Initial reveal states are enabled by JavaScript */
.irving-motion-ready .irving-reveal {
  opacity: 0;
  transform: translate3d(0, 48px, 0);
  transition:
    opacity var(--irving-motion-duration) var(--irving-motion-ease),
    transform var(--irving-motion-duration) var(--irving-motion-ease);
  will-change: opacity, transform;
}

/* Reveal from different directions */
.irving-motion-ready .irving-from-left {
  transform: translate3d(-72px, 12px, 0);
}

.irving-motion-ready .irving-from-right {
  transform: translate3d(72px, 12px, 0);
}

.irving-motion-ready .irving-from-bottom {
  transform: translate3d(0, 65px, 0);
}

.irving-motion-ready .irving-from-top {
  transform: translate3d(0, -42px, 0);
}

/* The element has arrived */
.irving-motion-ready .irving-reveal.irving-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  will-change: auto;
}

/* Staggered items: service cards, process rows, pricing */
.irving-motion-ready .irving-stagger {
  opacity: 0;
  transform: translate3d(0, 38px, 0) scale(.985);
  transition:
    opacity 750ms var(--irving-motion-ease),
    transform 850ms var(--irving-motion-ease);
}

.irving-motion-ready .irving-stagger.irving-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

/* A subtle lift when cards are hovered */
@media (hover: hover) and (pointer: fine) {
  .service-card,
  .investment-card {
    transition:
      transform 350ms var(--irving-motion-ease),
      border-color 350ms ease,
      box-shadow 350ms ease;
  }

  .service-card:hover,
  .investment-card:hover {
    transform: translateY(-5px);
  }
}

/* Hero entrance */
.irving-hero-enter {
  animation: irvingHeroEnter 1s var(--irving-motion-ease) both;
}

.irving-hero-delay-1 {
  animation-delay: 120ms;
}

.irving-hero-delay-2 {
  animation-delay: 260ms;
}

.irving-hero-delay-3 {
  animation-delay: 400ms;
}

@keyframes irvingHeroEnter {
  from {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    filter: blur(5px);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
  }
}

/* Thin page progress indicator */
#irving-scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 0%;
  height: 2px;
  z-index: 99999;
  pointer-events: none;
  background: var(--ink, currentColor);
  opacity: .75;
  transition: width 80ms linear;
}

/* Never force motion on users who request less animation */
@media (prefers-reduced-motion: reduce) {
  .irving-motion-ready .irving-reveal,
  .irving-motion-ready .irving-stagger,
  .irving-motion-ready .irving-reveal.irving-visible,
  .irving-motion-ready .irving-stagger.irving-visible {
    opacity: 1;
    transform: none;
    transition: none;
    filter: none;
  }

  .irving-hero-enter {
    animation: none !important;
    opacity: 1;
    transform: none;
    filter: none;
  }

  #irving-scroll-progress {
    display: none;
  }
}































