body {
   overflow-x: hidden;
 }

 body.modal-open {
   padding-right: 0 !important;
   overflow: auto !important;
 }

 .modal {
   padding-right: 0 !important;
 }

 :root {

   --primary-green: #10B981;
   --dark-bg: #050505;
   --frost-bg: rgba(255, 255, 255, 0.05);
   --frost-border: rgba(255, 255, 255, 0.15);
   --text-muted: #94A3B8;

   --swiss-white: #ffffff;
   --deep-slate: #0f172a;
   --border-light: rgba(0, 0, 0, 0.06);
   --shadow-sm: 0 20px 40px rgba(0, 0, 0, 0.05);
   --section-spacing: 140px;
 }

 .pill-nav {
   position: absolute;
   top: 24px;
   left: 50%;
   transform: translateX(-50%);
   width: 92%;
   max-width: 1150px;
   height: 70px;
   z-index: 2000;
   display: flex;
   align-items: center;
   transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
 }

 .pill-nav-solid {
   position: fixed;
   top: 0;
   left: 0;
   transform: none;
   width: 100%;
   max-width: 100%;
   border-radius: 0;
   height: 72px;
 }

 .pill-nav-solid .nav-glass-core {
   background: var(--deep-slate);
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
   border: none;
   border-radius: 0;
   box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06);
 }

 .pill-nav-solid .nav-content {
   max-width: 1150px;
   margin: 0 auto;
 }

 .nav-glass-core {
   position: absolute;
   inset: 0;
   background: var(--frost-bg);
   backdrop-filter: blur(18px) saturate(180%);
   -webkit-backdrop-filter: blur(18px) saturate(180%);
   border: 1px solid var(--frost-border);
   border-radius: 100px;
   box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.4);
   z-index: -1;
 }

 .nav-content {
   width: 100%;
   padding: 0 28px;
   display: flex;
   justify-content: space-between;
   align-items: center;
 }

 .nav-logo {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 800;
   font-size: 1.4rem;
   letter-spacing: -0.5px;
   color: #fff;
   text-decoration: none;
 }

 .nav-logo span {
   color: var(--primary-green);
 }

 .nav-status-tag {
   display: flex;
   align-items: center;
   gap: 8px;
   background: rgba(16, 185, 129, 0.08);
   padding: 6px 14px;
   border-radius: 30px;
   margin-left: 20px;
   border: 1px solid rgba(16, 185, 129, 0.2);
 }

 .status-text {
   font-size: 0.65rem;
   font-weight: 800;
   color: var(--primary-green);
   letter-spacing: 0.8px;
   text-transform: uppercase;
 }

 .nav-menu {
   display: flex;
   list-style: none;
   gap: 32px;
   margin: 0;
   padding: 0;
 }

 .nav-menu a {
   font-size: 0.9rem;
   font-weight: 600;
   color: rgba(255, 255, 255, 0.7);
   text-decoration: none;
   transition: 0.3s;
 }

 .nav-menu a:hover,
 .nav-menu a.active {
   color: var(--primary-green);
 }

 .nav-link-text {
   color: rgba(255, 255, 255, 0.7);
   text-decoration: none;
   font-size: 0.9rem;
   font-weight: 500;
   transition: color 0.3s ease;
   white-space: nowrap;
 }

 .nav-link-text:hover,
 .nav-link-text.active {
   color: var(--primary-green);
 }

 .nav-right {
   display: flex;
   align-items: center;
   gap: 20px;
 }

 .nav-btn-primary {
   background: #ffffff;
   color: #000 !important;
   padding: 12px 24px;
   border-radius: 50px;
   font-weight: 700;
   font-size: 0.85rem;
   text-decoration: none;
   transition: 0.3s;
 }

 .nav-btn-primary:hover {
   background: var(--primary-green);
   color: #fff !important;
 }

 .nav-btn-logout {
   display: inline-flex;
   align-items: center;
   gap: 6px;
 }

 .hero-premium {
   background-color: var(--dark-bg);
   min-height: 100vh;
   display: flex;
   align-items: center;
   position: relative;
   overflow: hidden;
   padding: 100px 0 100px 0;
   color: #fff;
 }

 .glow-mesh {
   position: absolute;
   top: -15%;
   right: -5%;
   width: 75vw;
   height: 75vw;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.12) 0%, transparent 70%);
   filter: blur(120px);
   animation: floatLight 18s infinite ease-in-out;
 }

 .hero-inner {
   position: relative;
   z-index: 10;
   max-width: 950px;
 }

 .hero-badge {
   display: inline-flex;
   align-items: center;
   gap: 10px;
   background: rgba(255, 255, 255, 0.03);
   border: 1px solid var(--frost-border);
   padding: 10px 20px;
   border-radius: 100px;
   font-size: 0.75rem;
   letter-spacing: 1.5px;
   text-transform: uppercase;
   font-weight: 700;
   margin-bottom: 2.5rem;
 }

 .hero-headline {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: clamp(3.8rem, 9.5vw, 6.8rem);
   font-weight: 800;
   line-height: 0.92;
   letter-spacing: -4px;
   margin-bottom: 2rem;
 }

 .gradient-text {
   background: linear-gradient(to right, #10B981, #34D399);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
 }

 .hero-subline {
   font-size: 1.3rem;
   color: var(--text-muted);
   max-width: 680px;
   line-height: 1.6;
   margin-bottom: 3.5rem;
 }

 .hero-actions {
   display: flex;
   gap: 24px;
 }

 .btn-main {
   background: var(--primary-green);
   color: #000 !important;
   padding: 20px 40px;
   border-radius: 16px;
   font-weight: 800;
   display: flex;
   align-items: center;
   gap: 12px;
   box-shadow: 0 12px 35px rgba(16, 185, 129, 0.35);
   transition: 0.3s;
   text-decoration: none;
 }

 .btn-main:hover {
   transform: translateY(-4px);
   box-shadow: 0 15px 45px rgba(16, 185, 129, 0.5);
 }

 .btn-outline {
   padding: 20px 40px;
   border-radius: 16px;
   border: 1px solid var(--frost-border);
   color: #fff !important;
   font-weight: 700;
   transition: 0.3s;
   text-decoration: none;
 }

 .btn-outline:hover {
   background: rgba(255, 255, 255, 0.05);
 }

 @keyframes floatLight {

   0%,
   100% {
     transform: translate(0, 0) scale(1);
   }

   50% {
     transform: translate(-8%, 8%) scale(1.15);
   }
 }

 .pulse-green {
   width: 7px;
   height: 7px;
   background: var(--primary-green);
   border-radius: 50%;
   animation: pulseStatic 2.5s infinite;
 }

 @keyframes pulseStatic {
   0% {
     transform: scale(1);
     opacity: 1;
   }

   50% {
     transform: scale(1.6);
     opacity: 0.4;
   }

   100% {
     transform: scale(1);
     opacity: 1;
   }
 }

 .section-market-split {
   background: #ffffff;
   padding: 120px 0;
   position: relative;
   overflow: hidden;
 }

 .market-content {

   margin-right: auto;
 }

 .pill-label {
   display: inline-block;
   background: rgba(16, 185, 129, 0.1);

   color: var(--primary-green);
   font-size: 0.8rem;
   font-weight: 700;
   letter-spacing: 1px;
   text-transform: uppercase;
   padding: 8px 16px;
   border-radius: 50px;
   margin-bottom: 24px;
 }

 .split-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: clamp(2.5rem, 4vw, 4.2rem);
   font-weight: 900;
   line-height: 1.05;
   letter-spacing: -2px;
   color: var(--deep-slate);
   margin-bottom: 24px;
 }

 .text-gradient {

   background: linear-gradient(135deg, #4F46E5, var(--primary-green));
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
 }

 .split-desc {
   font-size: 1.15rem;
   color: #a9acb1;
   line-height: 1.7;
   margin-bottom: 40px;
 }

 .split-desc strong {
   color: var(--deep-slate);
   font-weight: 700;
 }

 .stat-callout-card {
   display: flex;
   align-items: center;
   gap: 24px;
   padding: 24px 30px;
   background: #ffffff;
   border: 1px solid rgba(0, 0, 0, 0.08);
   border-radius: 20px;
   box-shadow: 0 15px 35px rgba(0, 0, 0, 0.04);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
 }

 .stat-callout-card:hover {
   transform: translateY(-4px);
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08);
 }

 .icon-circle {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 60px;
   height: 60px;
   background: #FEF3C7;

   border-radius: 16px;
   flex-shrink: 0;
 }

 .icon-circle .material-symbols-outlined {
   color: #D97706;

   font-size: 28px;
   font-variation-settings: 'FILL' 0, 'wght' 300;
 }

 .callout-text-group {
   display: flex;
   align-items: center;
   gap: 20px;
 }

 .callout-number {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 3.5rem;
   font-weight: 800;
   line-height: 1;
   color: #D97706;
 }

 .callout-desc {
   font-size: 0.95rem;
   color: #64748b;
   line-height: 1.5;
   font-weight: 500;
 }

 .market-visual {
   position: relative;
   padding: 20px;
 }

 .floating-3d-asset {
   animation: float3D 6s ease-in-out infinite;
   filter: drop-shadow(0 30px 40px rgba(0, 0, 0, 0.1));
 }

 @keyframes float3D {

   0%,
   100% {
     transform: translateY(0);
   }

   50% {
     transform: translateY(-20px);
   }
 }

 .mega-heading {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: clamp(2.1rem, 4.2vw, 4rem);
   font-weight: 900;
   line-height: 1.1;
   letter-spacing: -2px;

   color: var(--deep-slate, #0f172a);
   margin-bottom: 24px;
 }

 .text-gradient-green {

   background: linear-gradient(135deg, #10B981 0%, #047857 100%);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   display: inline-block;

 }

 .mega-heading.text-center {
   text-align: center;
   margin-left: auto;
   margin-right: auto;
   max-width: 900px;
 }

 .section-product {
   background: #ffffff;
   padding: 120px 0;
   position: relative;
   z-index: 1;
 }

 .section-title-clean {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: clamp(2rem, 4vw, 3.2rem);
   font-weight: 800;
   letter-spacing: -1.5px;
   color: var(--deep-slate);
   line-height: 1.1;
   margin: 0;
 }

 .product-image-wrapper {
   position: relative;
   display: inline-block;
 }

 .floating-app-img {
   max-width: 100%;

   animation: levitate 6s ease-in-out infinite;
   filter: drop-shadow(0 25px 35px rgba(0, 0, 0, 0.08));
 }

 @keyframes levitate {

   0%,
   100% {
     transform: translateY(0);
   }

   50% {
     transform: translateY(-15px);
   }
 }

 .feature-card-minimal {
   background: #ffffff;
   border: 1px solid rgba(0, 0, 0, 0.06);
   border-radius: 16px;
   padding: 32px 28px;
   height: 100%;
   transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.02);
 }

 .feature-card-minimal:hover {
   transform: translateY(-5px);
   border-color: rgba(16, 185, 129, 0.3);
   box-shadow: 0 15px 30px rgba(0, 0, 0, 0.05);
 }

 .feature-icon-green {
   font-size: 32px;
   color: var(--primary-green);
   margin-bottom: 20px;
   display: block;
   font-variation-settings: 'FILL' 0, 'wght' 300;
 }

 .feature-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 800;
   font-size: 1.15rem;
   color: var(--deep-slate);
   margin-bottom: 12px;
   letter-spacing: -0.5px;
 }

 .feature-desc {
   font-size: 0.95rem;
   color: #64748b;
   line-height: 1.6;
   margin: 0;
 }

 .launch-banner-minimal {
   display: flex;
   align-items: center;
   gap: 12px;
   background: rgba(16, 185, 129, 0.08);
   border: 1px solid rgba(16, 185, 129, 0.15);
   border-radius: 12px;
   padding: 16px 24px;
   color: var(--primary-green);
 }

 .launch-banner-minimal .material-symbols-outlined {
   font-size: 24px;
   font-variation-settings: 'FILL' 1;
 }

 .launch-text {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 700;
   font-size: 1rem;
   letter-spacing: 0.5px;
 }

 .section-features-grand {

   background-color: #f4fcf7;
   padding: 160px 0 120px 0;
   position: relative;
   z-index: 1;
   margin-top: -60px;

 }

 .grand-curve-top {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   line-height: 0;
   transform: translateY(-99%);

   z-index: 2;
 }

 .grand-curve-top svg {
   display: block;
   width: calc(100% + 1.3px);
   height: 120px;

 }

 .ambient-glow-bg {
   position: absolute;
   top: 20%;
   left: 50%;
   transform: translateX(-50%);
   width: 80vw;
   height: 800px;
   background: radial-gradient(ellipse at center, rgba(16, 185, 129, 0.08) 0%, transparent 60%);
   pointer-events: none;
   z-index: 0;
 }

 .feature-card-grand {
   background: rgba(255, 255, 255, 0.6);

   backdrop-filter: blur(20px) saturate(160%);
   -webkit-backdrop-filter: blur(20px) saturate(160%);
   border: 1px solid rgba(255, 255, 255, 1);
   border-radius: 32px;
   padding: 45px 35px;
   position: relative;
   overflow: hidden;
   transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
   box-shadow: 0 10px 40px rgba(0, 0, 0, 0.02);
 }

 .feature-card-grand::before {
   content: '';
   position: absolute;
   inset: 0;
   border-radius: 32px;
   box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.8),
     inset 0 20px 40px rgba(255, 255, 255, 0.4);
   z-index: -1;
   pointer-events: none;
 }

 .feature-card-grand:hover {
   transform: translateY(-10px) scale(1.02);
   border-color: rgba(16, 185, 129, 0.4);
   box-shadow: 0 30px 60px rgba(16, 185, 129, 0.1);
 }

 .icon-orb {
   width: 65px;
   height: 65px;
   border-radius: 50%;
   background: linear-gradient(135deg, #ffffff 0%, #f0fdf4 100%);
   border: 1px solid rgba(16, 185, 129, 0.2);
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 30px;
   box-shadow: 0 10px 20px rgba(16, 185, 129, 0.1);
   transition: all 0.4s ease;
 }

 .icon-orb .material-symbols-outlined {
   color: var(--primary-green);
   font-size: 30px;
   font-variation-settings: 'FILL' 1, 'wght' 200;
   transition: transform 0.4s ease;
 }

 .feature-card-grand:hover .icon-orb {
   background: linear-gradient(135deg, var(--primary-green) 0%, #047857 100%);
   border-color: transparent;
 }

 .feature-card-grand:hover .icon-orb .material-symbols-outlined {
   color: #ffffff;
   transform: scale(1.1);
 }

 .feature-card-grand .feature-title {
   font-size: 1.35rem;
   font-weight: 800;
   margin-bottom: 15px;
 }

 .feature-card-grand .feature-desc {
   font-size: 1.05rem;
   font-weight: 500;
 }

 .section-advantage-minimal {
   background: #ffffff;
   padding: 140px 0 100px 0;
   position: relative;
   z-index: 1;
 }

 .narrative-content-air {
   max-width: 540px;
 }

 .advantage-intro-air {
   font-size: 1.15rem;
   color: #a9acb1;
   line-height: 1.6;
   margin-bottom: 40px;
   font-weight: 500;
 }

 .minimal-list {
   list-style: none;
   padding: 0;
   margin: 0;
 }

 .minimal-list li {
   display: flex;
   align-items: center;
   gap: 18px;
   margin-bottom: 24px;
 }

 .list-icon-air {
   color: var(--primary-green);
   font-size: 24px;
   font-variation-settings: 'FILL' 0, 'wght' 300;
 }

 .list-text {
   font-size: 1.1rem;
   font-weight: 600;
   color: var(--deep-slate);
 }

 .social-label-air {
   display: block;
   font-size: 0.75rem;
   font-weight: 700;
   color: var(--text-muted);
   text-transform: uppercase;
   letter-spacing: 2px;
   margin-bottom: 16px;
 }

 .social-links-minimal {
   display: flex;
   align-items: center;
   gap: 30px;
 }

 .btn-text-link {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   font-weight: 700;
   font-size: 0.95rem;
   color: var(--deep-slate);
   text-decoration: none;
   padding-bottom: 2px;
   border-bottom: 2px solid transparent;
   transition: all 0.3s ease;
 }

 .btn-text-link:hover {
   color: var(--primary-green);
   border-bottom-color: var(--primary-green);
 }

 .social-dots {
   display: flex;
   gap: 10px;
 }

 .social-dots a {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 38px;
   height: 38px;
   border-radius: 10px;
   background: rgba(16, 185, 129, 0.08);
   border: 1px solid rgba(16, 185, 129, 0.15);
   color: var(--primary-green);
   font-size: 1rem;
   text-decoration: none;
   transition: all 0.3s ease;
 }

 .social-dots a:hover {
   background: var(--primary-green);
   color: #ffffff;
   border-color: var(--primary-green);
   transform: translateY(-2px);
   box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
 }

 .advantage-stack-air {
   display: flex;
   flex-direction: column;
   gap: 40px;

 }

 .air-card {
   display: grid;
   grid-template-columns: 80px 1fr;
   gap: 30px;
   padding: 40px;
   background: #ffffff;
   border-radius: 24px;
   border: 1px solid rgba(0, 0, 0, 0.04);
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.02);
   transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
 }

 .air-card:hover {
   transform: translateX(-10px);
   border-color: rgba(16, 185, 129, 0.2);
   box-shadow: 0 30px 60px rgba(16, 185, 129, 0.08);
 }

 .air-number {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 4.5rem;
   font-weight: 900;
   line-height: 0.8;
   color: rgba(16, 185, 129, 0.15);

   transition: color 0.4s ease;
 }

 .air-card:hover .air-number {
   color: var(--primary-green);
 }

 .air-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.35rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin-bottom: 12px;
 }

 .air-desc {
   font-size: 1.05rem;
   color: #64748b;
   line-height: 1.6;
   margin: 0;
 }

 .section-intro {
   background: #ffffff;
   padding: 130px 0;
   position: relative;
   z-index: 2;
 }

 .intro-lead {
   font-size: 1.25rem;
   color: var(--text-secondary);
   line-height: 1.7;
   margin-bottom: 2rem;
   max-width: 650px;
 }

 .mission-list {
   list-style: none;
   padding: 0;
   margin: 0;
 }

 .mission-list li {
   display: flex;
   align-items: flex-start;
   gap: 20px;
   margin-bottom: 24px;
 }

 .mission-icon {
   flex-shrink: 0;
   width: 48px;
   height: 48px;
   background: rgba(16, 185, 129, 0.08);
   border: 1px solid rgba(16, 185, 129, 0.15);
   border-radius: 12px;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .mission-icon .material-symbols-outlined {
   color: var(--primary-green);
   font-size: 24px;
   font-variation-settings: 'FILL' 1;
 }

 .mission-text {
   font-size: 1.05rem;
   color: var(--text-secondary);
   line-height: 1.6;
 }

 .mission-text strong {
   color: var(--deep-slate);
   display: block;
   margin-bottom: 2px;
   font-size: 1.1rem;
 }

 .founder-card-premium {
   background: #ffffff;
   border: 1px solid rgba(0, 0, 0, 0.06);
   border-radius: 24px;
   padding: 12px;

   position: relative;
   box-shadow: 0 20px 50px rgba(0, 0, 0, 0.04);
   transition: transform 0.4s ease, box-shadow 0.4s ease;
 }

 .founder-card-premium:hover {
   transform: translateY(-8px);
   box-shadow: 0 30px 60px rgba(16, 185, 129, 0.08);
   border-color: rgba(16, 185, 129, 0.2);
 }

 .card-bg-accent {
   position: absolute;
   top: 10%;
   right: -5%;
   width: 100%;
   height: 80%;
   background: var(--primary-green);
   opacity: 0.04;
   border-radius: 30px;
   z-index: -1;
   transform: rotate(3deg);
 }

 .founder-image-wrapper {
   width: 100%;
   border-radius: 16px;
   overflow: hidden;
   background: #f8fafc;

   aspect-ratio: 4/3;

   display: flex;
   align-items: flex-end;

   justify-content: center;
   position: relative;
 }

 .founder-img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.5s ease;
 }

 .founder-card-premium:hover .founder-img {
   transform: scale(1.03);
 }

 .founder-content {
   padding: 30px 20px 20px;
   text-align: center;
 }

 .founder-badge {
   display: inline-block;
   font-family: var(--font-display);
   font-size: 0.75rem;
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: 1px;
   color: var(--primary-green);
   margin-bottom: 12px;
 }

 .founder-name {
   font-family: var(--font-display);
   font-size: 1.8rem;
   font-weight: 900;
   color: var(--deep-slate);
   margin-bottom: 15px;
   letter-spacing: -0.5px;
 }

 .founder-bio {
   font-size: 1rem;
   color: var(--text-secondary);
   line-height: 1.6;
   margin: 0;
 }

 .section-structure-wave {
   background-color: #f4fcf7;

   padding: 160px 0 120px 0;
   position: relative;
   z-index: 1;
   margin-top: -60px;

 }

 .wave-curve-top {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   line-height: 0;
   transform: translateY(-99%);
   z-index: 2;
 }

 .wave-curve-top svg {
   display: block;
   width: calc(100% + 1.3px);

   height: 120px;
 }

 .section-structure-epic {
   background-color: #f4fcf7;

   padding: 100px 0 140px 0;
   position: relative;
   overflow: hidden;
 }

 .structure-network {
   position: relative;
   padding-top: 40px;
 }

 .network-core-glow {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 800px;
   height: 600px;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.08) 0%, transparent 70%);
   z-index: 0;
   pointer-events: none;
 }

 .network-lines {
   position: absolute;
   top: -60px;
   left: 0;
   width: 100%;
   height: 400px;
   z-index: 1;
   pointer-events: none;
   opacity: 0.6;
 }

 .glass-node-card {
   background: rgba(255, 255, 255, 0.7);
   backdrop-filter: blur(40px) saturate(150%);
   -webkit-backdrop-filter: blur(40px) saturate(150%);
   border: 1px solid rgba(255, 255, 255, 1);
   border-radius: 30px;
   padding: 45px;
   height: 100%;
   box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.8),
     0 15px 40px rgba(0, 0, 0, 0.03);
   transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
   position: relative;
 }

 .glass-node-card:hover {
   transform: translateY(-10px);
   box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 1),
     0 30px 60px rgba(16, 185, 129, 0.08);
   border-color: rgba(16, 185, 129, 0.3);
 }

 /* Clickable node cards */
 a.glass-node-link {
   display: block;
   color: inherit;
   text-decoration: none;
   height: 100%;
 }

 a.glass-node-link:hover .node-title {
   color: var(--primary-green);
 }

 a.glass-node-link .node-link-icon {
   font-size: 18px;
   color: var(--text-muted);
   opacity: 0;
   margin-left: auto;
   transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
 }

 a.glass-node-link:hover .node-link-icon {
   opacity: 1;
   color: var(--primary-green);
 }

 a.glass-node-link .node-footer {
   display: flex;
   align-items: center;
 }

 .node-header {
   display: flex;
   justify-content: space-between;
   align-items: flex-start;
   margin-bottom: 30px;
 }

 .node-icon-orb {
   width: 70px;
   height: 70px;
   border-radius: 20px;
   display: flex;
   align-items: center;
   justify-content: center;
   background: #ffffff;
   box-shadow: 0 10px 25px rgba(0, 0, 0, 0.04);
 }

 .node-icon-orb.green-glow {
   color: var(--primary-green);
   border: 1px solid rgba(16, 185, 129, 0.2);
 }

 .node-icon-orb.dark-glow {
   color: var(--deep-slate);
   border: 1px solid rgba(0, 0, 0, 0.08);
 }

 .node-icon-orb .material-symbols-outlined {
   font-size: 32px;
   font-variation-settings: 'FILL' 1;
 }

 .node-location {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   font-size: 0.85rem;
   font-weight: 700;
   color: var(--text-muted);
   background: rgba(255, 255, 255, 0.8);
   padding: 6px 14px;
   border-radius: 50px;
   border: 1px solid rgba(0, 0, 0, 0.04);
 }

 .node-location .material-symbols-outlined {
   font-size: 16px;
   color: var(--primary-green);
 }

 .node-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.6rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin-bottom: 12px;
   letter-spacing: -0.5px;
 }

 .node-desc {
   font-size: 1.1rem;
   color: #a9acb1;
   line-height: 1.6;
   margin-bottom: 35px;
 }

 .tech-badge {
   display: inline-block;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 0.85rem;
   font-weight: 800;
   padding: 8px 20px;
   background: rgba(16, 185, 129, 0.1);
   color: var(--primary-green);
   border-radius: 8px;
   text-transform: uppercase;
   letter-spacing: 1px;
 }

 .tech-badge.outline {
   background: transparent;
   border: 1px solid rgba(0, 0, 0, 0.1);
   color: var(--text-secondary);
 }

 .command-panel-glass {
   background: #ffffff;
   border-radius: 30px;
   padding: 60px;
   border: 1px solid rgba(0, 0, 0, 0.05);
   box-shadow: 0 20px 50px rgba(0, 0, 0, 0.02);
   position: relative;
   overflow: hidden;
 }

 .panel-accent-line {
   position: absolute;
   top: 0;
   left: 0;
   width: 6px;
   height: 100%;
   background: linear-gradient(180deg, var(--primary-green), #34D399);
 }

 .command-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.8rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin-bottom: 15px;
 }

 .command-desc {
   font-size: 1.15rem;
   color: #a9acb1;
   line-height: 1.7;
   margin: 0;
 }

 .command-metrics {
   display: flex;
   flex-direction: column;
   gap: 15px;
 }

 .metric-item {
   display: inline-flex;
   align-items: center;
   gap: 12px;
   padding: 12px 24px;
   background: #f8fafc;
   border-radius: 12px;
   font-weight: 700;
   color: var(--deep-slate);
   border: 1px solid rgba(0, 0, 0, 0.03);
 }

 .metric-item .material-symbols-outlined {
   color: var(--primary-green);
 }

 .philosophy-panel-premium {
   background: rgba(255, 255, 255, 0.9);
   backdrop-filter: blur(20px);
   -webkit-backdrop-filter: blur(20px);
   border-radius: 24px;
   padding: 50px 60px;
   border: 1px solid rgba(255, 255, 255, 1);
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.04);
   position: relative;
   overflow: hidden;
   transition: all 0.4s ease;
 }

 .philosophy-panel-premium:hover {
   box-shadow: 0 30px 60px rgba(16, 185, 129, 0.08);
   transform: translateY(-4px);
 }

 .panel-accent-line {
   position: absolute;
   top: 0;
   left: 0;
   width: 6px;
   height: 100%;
   background: linear-gradient(180deg, var(--primary-green), #047857);
   border-radius: 24px 0 0 24px;
 }

 .philosophy-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.8rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin-bottom: 15px;
 }

 .philosophy-desc {
   font-size: 1.1rem;
   color: #a9acb1;
   line-height: 1.7;
   margin: 0;
 }

 .btn-investor-portal {
   display: inline-flex;
   align-items: center;
   gap: 10px;
   background: var(--deep-slate);

   color: #ffffff;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 700;
   font-size: 1.05rem;
   padding: 14px 28px;
   border-radius: 50px;

   text-decoration: none;
   transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
   box-shadow: 0 10px 20px rgba(15, 23, 42, 0.15);
 }

 .btn-investor-portal .material-symbols-outlined {
   font-size: 20px;
   color: var(--primary-green);

 }

 .btn-investor-portal .arrow {
   font-size: 18px;
   color: #ffffff;
   transition: transform 0.3s ease;
 }

 .btn-investor-portal:hover {
   background: var(--primary-green);
   color: #ffffff;
   box-shadow: 0 15px 30px rgba(16, 185, 129, 0.3);
 }

 .btn-investor-portal:hover .material-symbols-outlined {
   color: #ffffff;
 }

 .btn-investor-portal:hover .arrow {
   transform: translateX(4px);

 }

 .metrics-stack {
   display: flex;
   flex-direction: column;
   gap: 16px;
 }

 .metric-pill {
   display: flex;
   align-items: center;
   gap: 16px;
   background: #f8fafc;
   border: 1px solid rgba(0, 0, 0, 0.03);
   padding: 16px 24px;
   border-radius: 16px;
   transition: all 0.3s ease;
 }

 .metric-pill:hover {
   background: #ffffff;
   border-color: rgba(16, 185, 129, 0.2);
   box-shadow: 0 8px 20px rgba(0, 0, 0, 0.04);
   transform: translateX(-5px);

 }

 .metric-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--primary-green);
 }

 .metric-icon .material-symbols-outlined {
   font-size: 24px;
 }

 .metric-text {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 700;
   font-size: 1.1rem;
   color: var(--deep-slate);
 }

 .section-ipo-dark {
   background-color: var(--dark-bg);
   padding: 160px 0;
   position: relative;
   overflow: hidden;
   color: #ffffff;
   border-radius: 48px;
   margin: 0 16px;
 }

 .ipo-glow-mesh {
   position: absolute;
   top: 15%;
   right: -10%;
   width: 65vw;
   height: 65vw;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.10) 0%, transparent 70%);
   filter: blur(120px);
   animation: floatLight 18s infinite ease-in-out;
   pointer-events: none;
   z-index: 0;
 }

 .dark-pill {
   background: rgba(16, 185, 129, 0.15) !important;
   color: var(--primary-green) !important;
   border: 1px solid rgba(16, 185, 129, 0.3);
 }

 .text-white {
   color: #ffffff !important;
 }

 .text-green {
   color: var(--primary-green) !important;
 }

 .ipo-track {
   position: relative;
   max-width: 900px;
   margin: 0 auto 60px;
   padding: 48px 0 0;
 }

 .ipo-track-line {
   position: absolute;
   top: 54px;
   left: 0;
   right: 0;
   height: 1px;
   background: rgba(255, 255, 255, 0.08);
 }

 .ipo-track-progress {
   height: 100%;
   width: 30%;
   background: var(--primary-green);
   box-shadow: 0 0 12px rgba(16, 185, 129, 0.25);
 }

 .ipo-milestones {
   display: flex;
   justify-content: space-between;
   position: relative;
 }

 .ipo-ms {
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 14px;
   flex: 1;
 }

 .ipo-ms-dot {
   width: 9px;
   height: 9px;
   border-radius: 50%;
   background: #334155;
   border: 2px solid #1e293b;
   position: relative;
   z-index: 2;
   transition: all 0.3s ease;
 }

 .ipo-ms.done .ipo-ms-dot {
   background: var(--primary-green);
   border-color: var(--primary-green);
   box-shadow: 0 0 8px rgba(16, 185, 129, 0.4);
 }

 .ipo-ms.current .ipo-ms-dot {
   background: var(--primary-green);
   border-color: var(--primary-green);
   box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.15), 0 0 12px rgba(16, 185, 129, 0.3);
   width: 11px;
   height: 11px;
 }

 .ipo-ms-label {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 0.92rem;
   font-weight: 700;
   color: #a9acb1;
   text-align: center;
   letter-spacing: -0.01em;
 }

 .ipo-ms.done .ipo-ms-label {
   color: #e2e8f0;
 }

 .ipo-ms.current .ipo-ms-label {
   color: var(--primary-green);
 }

 .ipo-ms-year {
   font-size: 0.75rem;
   color: #64748b;
   font-weight: 500;
   letter-spacing: 0.02em;
   text-align: center;
 }

 .ipo-ms.current .ipo-ms-year {
   color: rgba(16, 185, 129, 0.7);
 }

 .fin-strip {
   display: flex;
   align-items: stretch;
   justify-content: center;
   max-width: 820px;
   margin: 0 auto 40px;
 }

 .fin-strip-item {
   flex: 1;
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 6px;
   padding: 0 32px;
 }

 .fin-strip-divider {
   width: 1px;
   background: rgba(255, 255, 255, 0.08);
   align-self: stretch;
 }

 .fin-num {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: clamp(1.6rem, 2.8vw, 2.2rem);
   font-weight: 800;
   color: #fff;
   letter-spacing: -0.5px;
   line-height: 1;
 }

 .fin-desc {
   font-size: 0.82rem;
   color: #64748b;
   font-weight: 500;
   text-align: center;
 }

 .stock-ids {
   text-align: center;
   font-size: 0.85rem;
   color: #a9acb1;
   letter-spacing: 0.5px;
   font-family: 'DM Sans', sans-serif;
 }

 .stock-ids-sep {
   margin: 0 12px;
   color: #334155;
 }

 .section-invest-vip {
   background-color: #ffffff;

   padding: 140px 0;
   position: relative;
   z-index: 10;

 }

 .bond-certificate-card {
   background: #ffffff;
   border: 1px solid rgba(0, 0, 0, 0.08);
   border-radius: 24px;
   box-shadow: 0 30px 60px rgba(0, 0, 0, 0.06),
     0 0 0 8px rgba(16, 185, 129, 0.03);

   overflow: hidden;
   transition: transform 0.4s ease, box-shadow 0.4s ease;
 }

 .bond-certificate-card:hover {
   transform: translateY(-5px);
   box-shadow: 0 40px 80px rgba(0, 0, 0, 0.08),
     0 0 0 8px rgba(16, 185, 129, 0.06);
 }

 .bond-header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 30px 40px;
   background: #f8fafc;
   border-bottom: 1px solid rgba(0, 0, 0, 0.05);
 }

 .bond-title-group {
   display: flex;
   align-items: center;
   gap: 12px;
 }

 .verified-icon {
   color: var(--primary-green);
   font-size: 28px;
   font-variation-settings: 'FILL' 1;
 }

 .bond-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.5rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin: 0;
 }

 .secure-badge {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   font-size: 0.8rem;
   font-weight: 700;
   color: #64748b;
   text-transform: uppercase;
   letter-spacing: 1px;
 }

 .secure-badge .material-symbols-outlined {
   font-size: 16px;
 }

 .bond-data-list {
   padding: 10px 40px;
 }

 .bond-data-row {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 24px 0;
   border-bottom: 1px solid rgba(0, 0, 0, 0.05);
 }

 .bond-data-row:last-child {
   border-bottom: none;
 }

 .data-label {
   font-size: 1.05rem;
   color: #64748b;
   font-weight: 500;
   text-transform: capitalize;
 }

 .data-value {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.15rem;
   font-weight: 700;
   color: var(--deep-slate);
   text-align: right;
 }

 .highlight-row {
   padding: 30px 0;

 }

 .highlight-value {
   font-size: 1.5rem;
   font-weight: 900;
   background: linear-gradient(135deg, var(--primary-green), #047857);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
 }

 .bond-footer {
   padding: 35px 40px;
   background: #ffffff;
   text-align: center;
   border-top: 1px solid rgba(0, 0, 0, 0.05);
 }

 .btn-invest-action {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 12px;
   width: 100%;
   background: var(--primary-green);
   color: #ffffff;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 800;
   font-size: 1.2rem;
   padding: 18px 30px;
   border-radius: 16px;
   text-decoration: none;
   transition: all 0.4s ease;
   box-shadow: 0 10px 25px rgba(16, 185, 129, 0.25);
 }

 .btn-invest-action:hover {
   background: #047857;
   color: #ffffff;
   box-shadow: 0 15px 35px rgba(16, 185, 129, 0.35);
 }

 .btn-invest-action .material-symbols-outlined {
   transition: transform 0.3s ease;
 }

 .btn-invest-action:hover .material-symbols-outlined {
   transform: translateX(5px);
 }

 .security-note {
   font-size: 0.8rem;
   color: #94a3b8;
   margin: 15px 0 0 0;
 }

 .section-contact-modern {
   background: #f8fafc;

   padding: 120px 0;
   position: relative;
   z-index: 1;
 }

 .contact-company {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.5rem;
   font-weight: 900;
   color: var(--deep-slate);
   margin-bottom: 30px;
 }

 .contact-list-air {
   list-style: none;
   padding: 0;
   margin: 0;
 }

 .contact-list-air li {
   display: flex;
   align-items: flex-start;
   gap: 16px;
   margin-bottom: 30px;
 }

 .contact-list-air .material-symbols-outlined {
   color: var(--primary-green);
   font-size: 24px;
   font-variation-settings: 'FILL' 0, 'wght' 300;
   margin-top: 2px;
 }

 .info-text {
   font-size: 1.05rem;
   color: var(--deep-slate);
   line-height: 1.6;
 }

 .info-label {
   display: block;
   font-size: 0.75rem;
   font-weight: 700;
   color: #94a3b8;
   text-transform: uppercase;
   letter-spacing: 1px;
   margin-bottom: 4px;
 }

 .conversational-form-wrapper {
   background: #ffffff;
   border-radius: 24px;
   padding: 60px;
   border: 1px solid rgba(0, 0, 0, 0.04);
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.02);
 }

 .form-sentence {
   display: flex;
   flex-wrap: wrap;
   align-items: baseline;
   gap: 12px;
 }

 .static-text {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.8rem;
   font-weight: 100;
   color: var(--deep-slate);
 }

 .input-wrapper {
   position: relative;
   display: inline-block;
   min-width: 200px;
 }

 .input-wrapper.grow {
   flex-grow: 1;
   min-width: 300px;
 }

 .inline-input {
   width: 100%;
   background: transparent;
   border: none;
   border-bottom: 2px solid #e2e8f0;
   padding: 4px 8px;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.8rem;
   font-weight: 400;
   color: var(--primary-green);
   outline: none;
   transition: border-color 0.3s ease;
 }

 .inline-input::placeholder {
   color: #cbd5e1;
   font-weight: 500;
 }

 .inline-input:focus {
   border-bottom-color: var(--primary-green);
 }

 .btn-submit-modern {
   display: inline-flex;
   align-items: center;
   gap: 12px;
   background: var(--primary-green);
   color: #ffffff;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 800;
   font-size: 1.1rem;
   padding: 16px 32px;
   border: none;
   border-radius: 50px;
   cursor: pointer;
   transition: all 0.4s ease;
   box-shadow: 0 10px 20px rgba(16, 185, 129, 0.2);
 }

 .btn-submit-modern:hover {
   background: #047857;
   box-shadow: 0 15px 30px rgba(16, 185, 129, 0.3);
 }

 .btn-submit-modern .material-symbols-outlined {
   font-size: 20px;
   transition: transform 0.3s ease;
 }

 .btn-submit-modern:hover .material-symbols-outlined {
   transform: translateX(4px) translateY(-4px);

 }

 .footer-minimal {
   background: var(--dark-bg);
   color: #ffffff;
   padding: 64px 0 32px;
   position: relative;
   overflow: hidden;
 }

 .footer-glow-mesh {
   position: absolute;
   bottom: -20%;
   left: -10%;
   width: 60vw;
   height: 60vw;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.10) 0%, transparent 70%);
   filter: blur(120px);
   animation: floatLight 18s infinite ease-in-out;
   pointer-events: none;
   z-index: 0;
 }

 .footer-top {
   display: flex;
   gap: 60px;
   margin-bottom: 48px;
 }

 .footer-brand-col {
   flex: 0 0 280px;
 }

 .footer-brand-logo {
   display: inline-block;
   text-decoration: none;
   margin-bottom: 16px;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 800;
   font-size: 1.3rem;
   letter-spacing: -0.5px;
   color: #fff;
 }

 .footer-brand-logo span {
   color: var(--primary-green);
 }

 .footer-mission {
   font-size: 0.85rem;
   color: #64748b;
   line-height: 1.6;
   margin: 0;
 }

 .footer-links-grid {
   display: flex;
   gap: 48px;
   flex: 1;
 }

 .footer-link-col {
   flex: 1;
 }

 .footer-heading {
   font-family: 'DM Sans', sans-serif;
   font-size: 0.72rem;
   font-weight: 600;
   color: #64748b;
   margin-bottom: 16px;
   letter-spacing: 1px;
   text-transform: uppercase;
 }

 .footer-links {
   list-style: none;
   padding: 0;
   margin: 0;
 }

 .footer-links li {
   margin-bottom: 10px;
 }

 .footer-links a {
   color: #94a3b8;
   text-decoration: none;
   font-size: 0.88rem;
   font-weight: 500;
   transition: color 0.2s ease;
 }

 .footer-links a:hover {
   color: var(--primary-green);
 }

 .footer-info-line {
   color: #94a3b8;
   font-size: 0.88rem;
   line-height: 1.5;
 }

 .footer-divider {
   height: 1px;
   background: rgba(255, 255, 255, 0.06);
   margin-bottom: 24px;
 }

 .footer-bottom {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
   align-items: center;
 }

 .footer-bottom> :nth-child(2) {
   justify-self: center;
 }

 .footer-bottom> :nth-child(3) {
   justify-self: end;
 }

 .copyright-text {
   font-size: 0.8rem;
   color: #a9acb1;
   margin: 0;
   font-weight: 500;
 }

 .lang-selector {
   list-style: none;
   padding: 0;
   margin: 0;
   display: flex;
   align-items: center;
   gap: 4px;
 }

 .lang-sep {
   color: #334155;
   font-size: 0.8rem;
   user-select: none;
 }

 .lang-selector li a {
   text-decoration: none;
   color: #64748b;
   padding: 4px 8px;
   font-size: 0.8rem;
   font-weight: 500;
   border-radius: 4px;
   transition: color 0.2s ease;
 }

 .lang-selector li.active a {
   font-weight: 700;
   color: var(--primary-green);
 }

 .lang-selector li a:hover {
   color: var(--primary-green);
 }

 .lang-divider {
   color: #64748b;
   font-size: 0.85rem;
   user-select: none;
 }

 .lang-nav {
   display: flex;
   align-items: center;
 }

 .err_input {
   border-color: #dc3545 !important;
   box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
 }

 .inline-input.err_input {
   border-bottom-color: #dc3545 !important;
   box-shadow: none !important;
 }

 #loginModal,
 #forgotModal,
 #registerModal {
   overflow-x: hidden;
 }

 .vault-modal {
   background: transparent;
   border: none;
   border-radius: 24px;
   overflow: hidden;
   box-shadow:
     0 40px 80px -12px rgba(0, 0, 0, 0.18),
     0 0 0 1px rgba(0, 0, 0, 0.04);
 }

 .vault-split {
   display: grid;
   grid-template-columns: 260px 1fr;
   min-height: 500px;
 }

 .vault-brand-panel {
   background: var(--deep-slate);
   position: relative;
   overflow: hidden;
   padding: 44px 32px;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
 }

 .vault-ambient {
   position: absolute;
   top: -50%;
   left: -40%;
   width: 220%;
   height: 220%;
   background:
     radial-gradient(circle at 30% 20%, rgba(16, 185, 129, 0.12) 0%, transparent 45%),
     radial-gradient(circle at 80% 80%, rgba(16, 185, 129, 0.06) 0%, transparent 40%);
   pointer-events: none;
   animation: vaultAmbientDrift 15s ease-in-out infinite alternate;
 }

 @keyframes vaultAmbientDrift {
   0% {
     transform: translate(0, 0) scale(1);
   }

   100% {
     transform: translate(-3%, 5%) scale(1.05);
   }
 }

 .vault-grid-pattern {
   position: absolute;
   inset: 0;
   background-image:
     linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
     linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
   background-size: 48px 48px;
   pointer-events: none;
 }

 .vault-brand-content {
   position: relative;
   z-index: 2;
 }

 .vault-logo {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 2rem;
   font-weight: 900;
   color: #ffffff;
   letter-spacing: -1px;
   line-height: 1;
   margin-bottom: 20px;
 }

 .vault-logo span {
   color: var(--primary-green);
   margin-left: 2px;
 }

 .vault-tagline {
   font-size: 0.82rem;
   color: rgba(255, 255, 255, 0.45);
   line-height: 1.6;
   margin: 0;
   font-weight: 400;
 }

 .vault-brand-footer {
   position: relative;
   z-index: 2;
 }

 .vault-secure-indicator {
   display: inline-flex;
   align-items: center;
   gap: 10px;
   background: rgba(16, 185, 129, 0.08);
   border: 1px solid rgba(16, 185, 129, 0.12);
   padding: 8px 16px;
   border-radius: 50px;
   font-size: 0.68rem;
   font-weight: 600;
   color: var(--primary-green);
   text-transform: uppercase;
   letter-spacing: 1.5px;
 }

 .vault-pulse-dot {
   width: 6px;
   height: 6px;
   background: var(--primary-green);
   border-radius: 50%;
   box-shadow: 0 0 6px var(--primary-green);
   animation: vaultPulse 2.5s infinite;
 }

 @keyframes vaultPulse {

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

   50% {
     opacity: 0.3;
     transform: scale(1.5);
   }
 }

 .vault-form-panel {
   background: #ffffff;
   padding: 48px 44px;
   position: relative;
   display: flex;
   flex-direction: column;
   justify-content: center;
 }

 .vault-close-btn {
   position: absolute;
   top: 18px;
   right: 18px;
   width: 36px;
   height: 36px;
   background: #f8fafc;
   border: none;
   border-radius: 10px;
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   color: #94a3b8;
   transition: all 0.25s ease;
 }

 .vault-close-btn:hover {
   background: #f1f5f9;
   color: var(--deep-slate);
   transform: rotate(90deg);
 }

 .vault-close-btn .material-symbols-outlined {
   font-size: 18px;
 }

 .vault-form-header {
   margin-bottom: 32px;
 }

 .vault-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.65rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin: 0 0 6px;
   letter-spacing: -0.5px;
   line-height: 1.2;
 }

 .vault-subtitle {
   font-size: 0.88rem;
   color: #94a3b8;
   margin: 0;
   font-weight: 500;
 }

 .vault-form {
   display: flex;
   flex-direction: column;
 }

 .vault-field {
   margin-bottom: 22px;
 }

 .vault-field label {
   display: block;
   font-size: 0.78rem;
   font-weight: 600;
   color: var(--deep-slate);
   margin-bottom: 8px;
 }

 .vault-input-row {
   position: relative;
   display: flex;
   align-items: center;
 }

 .vault-field-icon {
   position: absolute;
   left: 14px;
   color: #cbd5e1;
   font-size: 20px;
   pointer-events: none;
   transition: color 0.3s ease;
   font-variation-settings: 'FILL' 0, 'wght' 300;
 }

 .vault-input-row input {
   width: 100%;
   padding: 14px 44px 14px 46px;
   background: #f8fafc;
   border: 1.5px solid #e2e8f0;
   font-size: 0.95rem;
   color: var(--deep-slate);
   font-family: 'DM Sans', sans-serif;
   font-weight: 500;
   transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
   outline: none;
   border-radius: 12px;
 }

 .vault-input-row input::placeholder {
   color: #c1c9d4;
   font-weight: 400;
 }

 .vault-input-row input:focus {
   background: #ffffff;
   border-color: var(--primary-green);
   box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.1);
 }

 .vault-input-line {
   display: none;
 }

 .vault-input-row:focus-within .vault-field-icon {
   color: var(--primary-green);
 }

 .vault-toggle-pw {
   position: absolute;
   right: 12px;
   background: none;
   border: none;
   cursor: pointer;
   display: none;
   color: #cbd5e1;
   padding: 4px;
   align-items: center;
   transition: color 0.2s ease;
 }

 .vault-toggle-pw:hover {
   color: var(--deep-slate);
 }

 .vault-toggle-pw .material-symbols-outlined {
   font-size: 20px;
 }

 .light-toggle-pw {
   position: absolute;
   right: 20px;
   top: 50%;
   transform: translateY(-50%);
   background: none;
   display: none;
   border: none;
   cursor: pointer;
   color: #94a3b8;
   padding: 4px;
   align-items: center;
   transition: color 0.2s ease;
   z-index: 2;
 }

 .light-toggle-pw:hover {
   color: var(--deep-slate);
 }

 .light-toggle-pw .material-symbols-outlined {
   font-size: 20px;
 }

 /* Hide browser's native password reveal button (Edge/Chrome on Windows) */
 input[type="password"]::-ms-reveal,
 input[type="password"]::-webkit-credentials-auto-fill-button {
   display: none !important;
   pointer-events: none !important;
 }

 .vault-field-footer {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-top: 8px;
 }

 .vault-register-link {
   font-size: 0.8rem;
   font-weight: 600;
   color: var(--primary-green);
   text-decoration: none;
   transition: all 0.2s ease;
 }

 .vault-register-link:hover {
   color: #047857;
 }

 .vault-forgot {
   font-size: 0.8rem;
   font-weight: 600;
   color: var(--primary-green);
   text-decoration: none;
   transition: all 0.2s ease;
 }

 .vault-forgot:hover {
   color: #047857;
 }

 .vault-submit {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   width: 100%;
   padding: 0;
   margin-top: 8px;
   background: var(--deep-slate);
   color: #ffffff;
   border: none;
   border-radius: 12px;
   cursor: pointer;
   transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
   overflow: hidden;
   height: 52px;
 }

 .vault-submit-text {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 0.95rem;
   font-weight: 700;
   letter-spacing: 0.2px;
 }

 .vault-submit-arrow {
   width: 28px;
   height: 28px;
   background: var(--primary-green);
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 8px;
   flex-shrink: 0;
   transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
 }

 .vault-submit-arrow .material-symbols-outlined {
   font-size: 16px;
   color: #ffffff;
   transition: transform 0.3s ease;
 }

 .vault-submit:hover {
   background: var(--primary-green);
   box-shadow: 0 8px 24px rgba(16, 185, 129, 0.25);
   transform: translateY(-1px);
 }

 .vault-submit:hover .vault-submit-arrow {
   background: rgba(255, 255, 255, 0.2);
 }

 .vault-submit:hover .vault-submit-arrow .material-symbols-outlined {
   transform: translateX(3px);
 }

 #loginModal .modal-dialog {
   max-width: 720px;
 }

 .vault-modal-compact {
   border-radius: 24px;
 }

 .vault-modal-compact .vault-form-panel {
   padding: 40px 36px;
 }

 .modal-sm-custom {
   max-width: 440px;
 }

 .forgot-icon-wrap {
   width: 52px;
   height: 52px;
   border-radius: 14px;
   background: rgba(16, 185, 129, 0.08);
   display: flex;
   align-items: center;
   justify-content: center;
   margin-bottom: 20px;
 }

 .forgot-icon-wrap .material-symbols-outlined {
   font-size: 26px;
   color: var(--primary-green);
 }

 .vault-back-link {
   text-align: center;
   margin-top: 20px;
 }

 .vault-back-link a {
   color: #64748b;
   font-size: 0.85rem;
   font-weight: 600;
   text-decoration: none;
   transition: color 0.2s ease;
 }

 .vault-back-link a:hover {
   color: var(--primary-green);
 }

 .portal-atelier {
   background-color: #f6f8fb;
   min-height: 100vh;
   position: relative;
   overflow-x: hidden;
 }

 .atelier-ambient {
   position: absolute;
   top: 0;
   right: -10%;
   width: 60vw;
   height: 60vh;
   background: radial-gradient(ellipse at center, rgba(16, 185, 129, 0.04) 0%, transparent 60%);
   pointer-events: none;
   z-index: 0;
 }

 .atelier-header {
   background: rgba(255, 255, 255, 0.85);
   backdrop-filter: blur(30px) saturate(180%);
   -webkit-backdrop-filter: blur(30px) saturate(180%);
   border-bottom: 1px solid rgba(0, 0, 0, 0.04);
   padding: 16px 0;
   position: sticky;
   top: 0;
   z-index: 100;
   box-shadow: 0 4px 30px rgba(0, 0, 0, 0.02);
 }

 .atelier-brand {
   display: flex;
   align-items: center;
   gap: 14px;
 }

 .atelier-logo {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 900;
   font-size: 1.5rem;
   color: var(--deep-slate);
   letter-spacing: -0.5px;
 }

 .green-dot {
   color: var(--primary-green);
 }

 .atelier-divider {
   width: 1px;
   height: 20px;
   background: rgba(0, 0, 0, 0.1);
 }

 .atelier-tag {
   font-size: 0.78rem;
   font-weight: 700;
   color: #94a3b8;
   text-transform: uppercase;
   letter-spacing: 2px;
 }

 .atelier-session-pill {
   display: flex;
   align-items: center;
   gap: 8px;
   background: rgba(16, 185, 129, 0.06);
   border: 1px solid rgba(16, 185, 129, 0.12);
   padding: 7px 16px;
   border-radius: 50px;
   font-size: 0.78rem;
   font-weight: 600;
   color: #64748b;
 }

 .session-code {
   font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
   font-weight: 800;
   color: var(--deep-slate);
   letter-spacing: 1px;
 }

 .atelier-back-link {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 38px;
   height: 38px;
   border-radius: 12px;
   background: #f1f5f9;
   color: #64748b;
   text-decoration: none;
   transition: all 0.25s ease;
 }

 .atelier-back-link:hover {
   background: var(--deep-slate);
   color: #ffffff;
 }

 .atelier-back-link .material-symbols-outlined {
   font-size: 20px;
 }

 .atelier-intro {
   font-size: 1.15rem;
   color: #64748b;
   line-height: 1.7;
   max-width: 600px;
   margin-top: 10px;
 }

 .atelier-metrics-strip {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 20px;
 }

 .metric-glass-card {
   background: rgba(255, 255, 255, 0.75);
   backdrop-filter: blur(20px);
   -webkit-backdrop-filter: blur(20px);
   border: 1px solid rgba(255, 255, 255, 0.9);
   border-radius: 20px;
   padding: 28px 24px;
   display: flex;
   flex-direction: column;
   gap: 8px;
   box-shadow:
     0 4px 20px rgba(0, 0, 0, 0.02),
     inset 0 1px 0 rgba(255, 255, 255, 0.8);
   transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
 }

 .metric-glass-card:hover {
   transform: translateY(-4px);
   box-shadow:
     0 20px 40px rgba(0, 0, 0, 0.04),
     inset 0 1px 0 rgba(255, 255, 255, 1);
   border-color: rgba(16, 185, 129, 0.2);
 }

 .mgc-label {
   font-size: 0.72rem;
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 1px;
   color: #94a3b8;
 }

 .mgc-value {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.6rem;
   font-weight: 900;
   color: var(--deep-slate);
   letter-spacing: -0.5px;
 }

 .atelier-glass-panel {
   background: rgba(255, 255, 255, 0.8);
   backdrop-filter: blur(30px) saturate(160%);
   -webkit-backdrop-filter: blur(30px) saturate(160%);
   border: 1px solid rgba(255, 255, 255, 0.95);
   border-radius: 24px;
   overflow: hidden;
   box-shadow:
     0 8px 30px rgba(0, 0, 0, 0.02),
     inset 0 1px 0 rgba(255, 255, 255, 1);
   transition: all 0.4s ease;
 }

 .atelier-glass-panel:hover {
   box-shadow:
     0 20px 50px rgba(0, 0, 0, 0.04),
     inset 0 1px 0 rgba(255, 255, 255, 1);
 }

 .agp-header {
   display: flex;
   align-items: center;
   gap: 12px;
   padding: 28px 36px;
   border-bottom: 1px solid rgba(0, 0, 0, 0.04);
 }

 .agp-icon {
   color: var(--primary-green);
   font-size: 22px;
   font-variation-settings: 'FILL' 0, 'wght' 400;
 }

 .agp-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.15rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin: 0;
   letter-spacing: -0.3px;
 }

 .agp-body {
   padding: 36px;
 }

 .agp-greeting {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.3rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin-bottom: 24px;
 }

 .agp-body p {
   font-size: 1.02rem;
   color: #a9acb1;
   line-height: 1.8;
   margin-bottom: 20px;
 }

 .agp-body strong {
   color: var(--deep-slate);
   font-weight: 700;
 }

 .atelier-doc-stack {
   padding: 12px;
   display: flex;
   flex-direction: column;
   gap: 6px;
 }

 .atelier-doc {
   display: flex;
   align-items: center;
   gap: 14px;
   padding: 14px 18px;
   border-radius: 16px;
   text-decoration: none;
   transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
   background: transparent;
 }

 .atelier-doc:hover {
   background: rgba(16, 185, 129, 0.04);
 }

 .adoc-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 42px;
   height: 42px;
   background: rgba(16, 185, 129, 0.08);
   color: var(--primary-green);
   border-radius: 12px;
   flex-shrink: 0;
   transition: all 0.3s ease;
 }

 .atelier-doc:hover .adoc-icon {
   background: var(--primary-green);
   color: #ffffff;
 }

 .adoc-icon .material-symbols-outlined {
   font-size: 20px;
 }

 .adoc-info {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
 }

 .adoc-name {
   font-size: 0.95rem;
   font-weight: 700;
   color: var(--deep-slate);
 }

 .adoc-meta {
   font-size: 0.8rem;
   color: #94a3b8;
   margin-top: 1px;
 }

 .adoc-arrow {
   font-size: 18px;
   color: #cbd5e1;
   transition: all 0.3s ease;
 }

 .atelier-doc:hover .adoc-arrow {
   color: var(--primary-green);
   transform: translateX(3px);
 }

 .atelier-widget-area {
   background: #f8fafc;
   border: 1px dashed rgba(0, 0, 0, 0.06);
   border-radius: 16px;
   margin: 20px 24px;
   min-height: 200px;
 }

 .atelier-stock-ids {
   display: flex;
   justify-content: space-between;
   padding: 16px 28px 20px;
   font-size: 0.85rem;
   color: #94a3b8;
   border-top: 1px solid rgba(0, 0, 0, 0.03);
 }

 .atelier-stock-ids strong {
   color: var(--deep-slate);
   font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
   letter-spacing: 0.5px;
 }

 .atelier-pillar {
   background: rgba(255, 255, 255, 0.7);
   backdrop-filter: blur(20px);
   -webkit-backdrop-filter: blur(20px);
   border: 1px solid rgba(255, 255, 255, 0.9);
   border-radius: 24px;
   padding: 40px 32px;
   height: 100%;
   position: relative;
   overflow: hidden;
   transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
   box-shadow:
     0 4px 20px rgba(0, 0, 0, 0.02),
     inset 0 1px 0 rgba(255, 255, 255, 0.8);
 }

 .atelier-pillar:hover {
   transform: translateY(-8px);
   border-color: rgba(16, 185, 129, 0.2);
   box-shadow:
     0 25px 50px rgba(0, 0, 0, 0.06),
     inset 0 1px 0 rgba(255, 255, 255, 1);
 }

 .ap-accent {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 3px;
   background: linear-gradient(90deg, transparent, var(--primary-green), transparent);
   opacity: 0;
   transition: opacity 0.4s ease;
 }

 .atelier-pillar:hover .ap-accent {
   opacity: 1;
 }

 .atelier-pillar.featured .ap-accent {
   opacity: 0.4;
 }

 .atelier-pillar.featured {
   background: rgba(255, 255, 255, 0.85);
   border-color: rgba(16, 185, 129, 0.08);
 }

 .ap-number {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 3rem;
   font-weight: 900;
   color: rgba(16, 185, 129, 0.08);
   line-height: 1;
   margin-bottom: 20px;
   transition: color 0.4s ease;
 }

 .atelier-pillar:hover .ap-number {
   color: rgba(16, 185, 129, 0.15);
 }

 .ap-icon-wrap {
   width: 56px;
   height: 56px;
   border-radius: 16px;
   background: rgba(16, 185, 129, 0.08);
   border: 1px solid rgba(16, 185, 129, 0.12);
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--primary-green);
   margin-bottom: 24px;
   transition: all 0.4s ease;
 }

 .atelier-pillar:hover .ap-icon-wrap {
   background: var(--primary-green);
   color: #ffffff;
   border-color: transparent;
 }

 .ap-icon-wrap .material-symbols-outlined {
   font-size: 26px;
   font-variation-settings: 'FILL' 0, 'wght' 300;
 }

 .ap-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.3rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin-bottom: 14px;
   letter-spacing: -0.3px;
 }

 .ap-text {
   font-size: 0.98rem;
   color: #64748b;
   line-height: 1.7;
   margin: 0;
 }

 .ap-text strong {
   color: var(--deep-slate);
   font-weight: 700;
 }

 .cookie-bar {
   position: fixed;
   bottom: 24px;
   left: 50%;
   transform: translateX(-50%) translateY(120%);
   z-index: 9999;
   background: var(--dark-bg);
   border: 1px solid rgba(255, 255, 255, 0.08);
   border-radius: 16px;
   padding: 24px 28px;
   display: flex;
   flex-direction: column;
   gap: 16px;
   max-width: 520px;
   width: calc(100% - 32px);
   box-shadow: 0 16px 48px rgba(0, 0, 0, 0.4);
   backdrop-filter: blur(12px);
   opacity: 0;
   transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease;
 }

 .cookie-bar.visible {
   transform: translateX(-50%) translateY(0);
   opacity: 1;
 }

 .cookie-bar-text {
   font-size: 0.85rem;
   color: #94a3b8;
   margin: 0;
   line-height: 1.6;
   text-align: center;
 }

 .cookie-bar-text a {
   color: var(--primary-green);
   text-decoration: none;
   font-weight: 600;
 }

 .cookie-bar-text a:hover {
   text-decoration: underline;
 }

 .cookie-bar-actions {
   display: flex;
   gap: 10px;
   flex-shrink: 0;
   justify-content: center;
   gap: 25px;
 }

 .cookie-btn-accept,
 .cookie-btn-decline {
   border: none;
   border-radius: 10px;
   padding: 10px 20px;
   font-size: 0.82rem;
   font-weight: 700;
   cursor: pointer;
   transition: all 0.2s ease;
   font-family: 'DM Sans', sans-serif;
 }

 .cookie-btn-accept {
   background: var(--primary-green);
   color: #000;
 }

 .cookie-btn-accept:hover {
   box-shadow: 0 4px 16px rgba(16, 185, 129, 0.35);
 }

 .cookie-btn-decline {
   background: rgba(255, 255, 255, 0.06);
   color: #94a3b8;
   border: 1px solid rgba(255, 255, 255, 0.08);
 }

 .cookie-btn-decline:hover {
   background: rgba(255, 255, 255, 0.1);
   color: #e2e8f0;
 }

 /* --- STRUCTURED B2B CONTACT FORM --- */
 .structured-form-card {
   background: #ffffff;
   border-radius: 16px;
   padding: 45px;
   border: 1px solid rgba(0, 0, 0, 0.05);
   box-shadow: 0 15px 35px rgba(0, 0, 0, 0.02);
 }

 /* Form Labels */
 .form-label-pro {
   display: block;
   font-family: 'Inter', sans-serif;
   font-size: 0.9rem;
   font-weight: 300;
   color: var(--deep-slate);
   margin-bottom: 8px;
 }

 /* Standard Inputs & Textarea */
 .form-control-pro,
 .form-select-pro {
   width: 100%;
   background-color: #ffffff;
   border: 1px solid #cbd5e1;
   /* Clean gray border */
   border-radius: 8px;
   padding: 14px 16px;
   font-family: 'Inter', sans-serif;
   font-size: 1rem;
   color: var(--deep-slate);
   transition: all 0.3s ease;
   box-shadow: none;
   outline: none;
 }

 /* Custom styling for the Select Dropdown to match inputs */
 .form-select-pro {
   appearance: none;
   background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
   background-repeat: no-repeat;
   background-position: right 16px center;
   background-size: 16px;
   padding-right: 40px;
   cursor: pointer;
 }

 /* Focus States (The Green Highlight) */
 .form-control-pro:focus,
 .form-select-pro:focus {
   border-color: var(--primary-green);
   box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.1);
 }

 /* Disable browser's default focus ring on the select */
 .form-select-pro:focus-visible {
   outline: none;
 }

 /* Full Width Submit Button */
 .btn-submit-full {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 10px;
   width: 100%;
   background-color: var(--primary-green);
   color: #ffffff;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 800;
   font-size: 1.15rem;
   padding: 16px;
   border: none;
   border-radius: 50px;
   /* Pill shape matching the screenshot */
   cursor: pointer;
   transition: all 0.3s ease;
 }

 .btn-submit-full:hover {
   background-color: #047857;
   /* Darker emerald on hover */
   transform: translateY(-2px);
   box-shadow: 0 10px 20px rgba(16, 185, 129, 0.25);
 }

 .btn-submit-full .material-symbols-outlined {
   font-size: 20px;
   font-variation-settings: 'wght' 300;
 }

 /* Mobile Adjustments */
 @media (max-width: 768px) {
   .structured-form-card {
     padding: 30px 20px;
   }
 }

 /* --- MODERN ROUNDED B2B CONTACT FORM --- */
 .structured-form-card {
   background: #ffffff;
   border-radius: 24px;
   /* Slightly softer card corners */
   padding: 50px;
   border: 1px solid rgba(0, 0, 0, 0.04);
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.03);
 }

 /* Form Labels */
 .form-label-pro {
   display: block;
   font-family: 'Inter', sans-serif;
   font-size: 0.9rem;
   font-weight: 300;
   color: var(--deep-slate);
   margin-bottom: 10px;
   padding-left: 8px;
   /* Aligns visually with the rounded inputs */
 }

 /* Modern Rounded Inputs */
 .form-control-pro,
 .form-select-pro {
   width: 100%;
   background-color: #f8fafc;
   /* Soft, modern slate background */
   border: 2px solid transparent;
   /* Invisible border by default */
   border-radius: 50px;
   /* Fully rounded pill shape */
   padding: 16px 24px;
   font-family: 'Inter', sans-serif;
   font-size: 1rem;
   color: var(--deep-slate);
   transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
   box-shadow: none;
   outline: none;
 }

 /* Textarea specific styling (so it doesn't look like a warped oval) */
 textarea.form-control-pro {
   border-radius: 24px;
   /* Softer squircle for multi-line text */
   padding: 20px 24px;
   resize: none;
   /* Keeps the design clean */
 }

 /* Custom styling for the Select Dropdown */
 .form-select-pro {
   appearance: none;
   background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
   background-repeat: no-repeat;
   background-position: right 20px center;
   background-size: 14px;
   padding-right: 50px;
   cursor: pointer;
 }

 /* Focus States (The "App" Feel) */
 .form-control-pro:focus,
 .form-select-pro:focus {
   background-color: #ffffff;
   border-color: var(--primary-green);
   box-shadow: 0 10px 20px rgba(16, 185, 129, 0.08);
   /* Soft floating shadow */
   transform: translateY(-2px);
   /* Slight lift on focus */
 }

 /* Disable browser's default focus ring */
 .form-select-pro:focus-visible {
   outline: none;
 }

 /* Custom Select Dropdown */
 .custom-select-pro {
   position: relative;
   width: 100%;
 }

 .custom-select-pro__trigger {
   display: flex;
   align-items: center;
   justify-content: space-between;
   width: 100%;
   background-color: #f8fafc;
   border: 2px solid transparent;
   border-radius: 50px;
   padding: 16px 24px;
   font-family: 'Inter', sans-serif;
   font-size: 15px;
   color: var(--deep-slate);
   cursor: pointer;
   transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
   outline: none;
   user-select: none;
 }

 .custom-select-pro__trigger:hover {
   background-color: #f1f5f9;
 }

 .custom-select-pro__trigger:focus {
   background-color: #ffffff;
   border-color: var(--primary-green);
   box-shadow: 0 10px 20px rgba(16, 185, 129, 0.08);
   transform: translateY(-2px);
   outline: none;
 }

 .custom-select-pro.open .custom-select-pro__trigger {
   background-color: #ffffff;
   border-color: var(--primary-green);
   box-shadow: 0 10px 20px rgba(16, 185, 129, 0.08);
   transform: translateY(-2px);
 }

 .custom-select-pro__arrow {
   flex-shrink: 0;
   transition: transform 0.3s ease;
 }

 .custom-select-pro.open .custom-select-pro__arrow {
   transform: rotate(180deg);
 }

 .custom-select-pro__dropdown {
   position: absolute;
   top: calc(100% + 6px);
   left: 0;
   right: 0;
   background: #ffffff;
   border: 1px solid rgba(0, 0, 0, 0.06);
   border-radius: 20px;
   padding: 8px;
   box-shadow: 0 12px 32px rgba(0, 0, 0, 0.1);
   opacity: 0;
   visibility: hidden;
   transform: translateY(-8px);
   transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
   z-index: 100;
 }

 .custom-select-pro.open .custom-select-pro__dropdown {
   opacity: 1;
   visibility: visible;
   transform: translateY(0);
 }

 .custom-select-pro__option {
   padding: 12px 20px;
   font-family: 'Inter', sans-serif;
   font-size: 0.95rem;
   color: var(--deep-slate);
   border-radius: 14px;
   cursor: pointer;
   transition: background-color 0.15s ease;
 }

 .custom-select-pro__option:hover,
 .custom-select-pro__option.kb-focus {
   background-color: #f0fdf4;
 }

 .custom-select-pro__option.selected {
   background-color: rgba(16, 185, 129, 0.08);
   color: var(--primary-green);
   font-weight: 500;
 }

 /* Full Width Modern Submit Button */
 .btn-submit-full {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 12px;
   width: 100%;
   background-color: var(--primary-green);
   color: #ffffff;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 800;
   font-size: 1.15rem;
   padding: 18px;
   border: none;
   border-radius: 50px;
   cursor: pointer;
   transition: all 0.4s ease;
   box-shadow: 0 10px 20px rgba(16, 185, 129, 0.2);
   margin-top: 10px;
 }

 .btn-submit-full:hover {
   background-color: #047857;
   box-shadow: 0 15px 30px rgba(16, 185, 129, 0.3);
 }

 .btn-submit-full .material-symbols-outlined {
   font-size: 22px;
   transition: transform 0.3s ease;
 }

 .btn-submit-full:hover .material-symbols-outlined {
   transform: translateX(4px) translateY(-4px);
   /* Fly-away animation */
 }

 /* Mobile Adjustments */
 @media (max-width: 768px) {
   .structured-form-card {
     padding: 35px 25px;
   }
 }

 /* --- EPIC REGISTRATION MASTER --- */
 .registration-epic-wrapper {
   background-color: #050505;
   /* Absolute obsidian */
   min-height: 100vh;
   font-family: 'Inter', sans-serif;
   color: #cbd5e1;
   position: relative;
   overflow-x: hidden;
 }

 /* Background Glow */
 .gateway-ambient-glow {
   position: absolute;
   top: 50%;
   right: 25%;
   transform: translateY(-50%);
   width: 800px;
   height: 800px;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.08) 0%, transparent 60%);
   pointer-events: none;
   z-index: 0;
 }

 /* --- LEFT SIDEBAR (Cinematic Brand Area) --- */
 .cinematic-sidebar {
   background: linear-gradient(135deg, rgba(255, 255, 255, 0.02) 0%, rgba(0, 0, 0, 0.5) 100%);
   border-right: 1px solid rgba(255, 255, 255, 0.05);
   padding: 60px 80px;
   position: relative;
   z-index: 2;
 }

 .logo-type {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 900;
   font-size: 1.8rem;
   color: #ffffff;
   text-decoration: none;
   letter-spacing: -0.5px;
 }

 .vault-label {
   display: inline-block;
   font-family: monospace;
   color: var(--primary-green);
   background: rgba(16, 185, 129, 0.1);
   padding: 6px 14px;
   border-radius: 4px;
   font-size: 0.85rem;
   letter-spacing: 1px;
   border: 1px solid rgba(16, 185, 129, 0.2);
 }

 .grand-title-sm {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: clamp(2.5rem, 4vw, 3.5rem);
   font-weight: 900;
   line-height: 1.1;
   letter-spacing: -1.5px;
   color: #ffffff;
 }

 .text-glow-emerald {
   color: var(--primary-green);
   text-shadow: 0 0 30px rgba(16, 185, 129, 0.4);
 }

 .sidebar-lead {
   font-size: 1.15rem;
   color: #94a3b8;
   line-height: 1.7;
   max-width: 450px;
 }

 .security-codes {
   font-family: monospace;
   color: #a9acb1;
   font-size: 0.95rem;
 }

 .security-codes strong {
   color: #94a3b8;
 }

 /* --- RIGHT SIDE (Glass Form Area) --- */
 .form-side {
   padding: 60px 20px;
   position: relative;
   z-index: 2;
 }

 .glass-form-container {
   width: 100%;
   max-width: 600px;
   /* Keeps the form perfectly sized */
   background: rgba(255, 255, 255, 0.02);
   backdrop-filter: blur(40px);
   -webkit-backdrop-filter: blur(40px);
   border: 1px solid rgba(255, 255, 255, 0.05);
   border-radius: 32px;
   padding: 60px;
   box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05);
 }

 .form-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 2rem;
   font-weight: 800;
   color: #ffffff;
   margin-bottom: 8px;
 }

 .form-subtitle {
   font-size: 1rem;
   color: #64748b;
 }

 /* Form Inputs */
 .epic-label {
   display: block;
   font-size: 0.85rem;
   font-weight: 600;
   color: #94a3b8;
   margin-bottom: 10px;
   padding-left: 5px;
 }

 .input-group-epic {
   position: relative;
 }

 .epic-input,
 .epic-select {
   width: 100%;
   background: rgba(255, 255, 255, 0.03);
   border: 1px solid rgba(255, 255, 255, 0.08);
   border-radius: 16px;
   padding: 16px 20px;
   color: #ffffff;
   font-family: 'Inter', sans-serif;
   font-size: 1rem;
   transition: all 0.3s ease;
   outline: none;
 }

 .epic-select {
   appearance: none;
   background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
   background-repeat: no-repeat;
   background-position: right 20px center;
   background-size: 16px;
   cursor: pointer;
 }

 /* Icon Inputs */
 .input-icon-wrapper {
   position: relative;
 }

 .input-icon {
   position: absolute;
   left: 20px;
   top: 50%;
   transform: translateY(-50%);
   color: #64748b;
   font-size: 20px;
   transition: color 0.3s ease;
 }

 .epic-input.with-icon {
   padding-left: 55px;
 }

 .epic-input::placeholder {
   color: #a9acb1;
 }

 /* Focus States (Emerald Glow) */
 .epic-input:focus,
 .epic-select:focus {
   background: rgba(255, 255, 255, 0.05);
   border-color: var(--primary-green);
   box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.1);
 }

 .epic-input:focus+.input-icon,
 .input-icon-wrapper:focus-within .input-icon {
   color: var(--primary-green);
 }

 /* Submit Button */
 .btn-epic-submit {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 12px;
   background: var(--primary-green);
   color: #ffffff;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 800;
   font-size: 1.15rem;
   padding: 18px;
   border: none;
   border-radius: 16px;
   cursor: pointer;
   transition: all 0.4s ease;
   box-shadow: 0 10px 25px rgba(16, 185, 129, 0.25);
 }

 .btn-epic-submit:hover {
   background: #047857;
   transform: translateY(-3px);
   box-shadow: 0 15px 35px rgba(16, 185, 129, 0.4);
 }

 .btn-epic-submit .material-symbols-outlined {
   transition: transform 0.3s ease;
 }

 .btn-epic-submit:hover .material-symbols-outlined {
   transform: translateX(5px);
 }

 /* Footer Link */
 .form-footer-link p {
   color: #64748b;
   font-size: 0.95rem;
 }

 .text-glow-link {
   color: var(--primary-green);
   text-decoration: none;
   font-weight: 600;
   transition: all 0.3s;
 }

 .text-glow-link:hover {
   color: #34D399;
   text-shadow: 0 0 15px rgba(16, 185, 129, 0.5);
 }

 /* Mobile Adjustments */
 @media (max-width: 991.98px) {
   .glass-form-container {
     padding: 40px 30px;
     border: none;
     background: transparent;
     box-shadow: none;
   }

   .registration-epic-wrapper {
     height: auto;
     min-height: 100vh;
   }
 }

 /* --- REGISTRATION SPLIT LAYOUT MASTER --- */
 .registration-split-wrapper {
   min-height: 100vh;
   font-family: 'Inter', sans-serif;
   overflow-x: hidden;
   background-color: #050505;
   /* Fallback */
 }

 /* --- LEFT SIDE: LIGHT & PRISTINE --- */
 .light-sidebar {
   background-color: #ffffff;
   /* Pure white */
   padding: 80px;
   border-right: 1px solid rgba(0, 0, 0, 0.05);
 }

 .logo-type-dark {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 900;
   font-size: 1.8rem;
   color: var(--deep-slate);
   text-decoration: none;
   letter-spacing: -0.5px;
 }

 .vault-label-light {
   display: inline-block;
   font-family: monospace;
   color: var(--primary-green);
   background: rgba(16, 185, 129, 0.1);
   padding: 6px 14px;
   border-radius: 4px;
   font-size: 0.85rem;
   letter-spacing: 1px;
   margin-bottom: 20px;
 }

 .grand-title-light {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: clamp(2.5rem, 4vw, 3.5rem);
   font-weight: 900;
   line-height: 1.1;
   letter-spacing: -1.5px;
   color: var(--deep-slate);
 }

 .sidebar-lead-light {
   font-size: 1.15rem;
   color: #a9acb1;
   line-height: 1.7;
   max-width: 480px;
 }

 .security-codes-light {
   font-family: monospace;
   color: #94a3b8;
   font-size: 0.95rem;
 }

 .security-codes-light strong {
   color: var(--deep-slate);
 }


 /* --- RIGHT SIDE: DARK & SECURE --- */
 .dark-form-side {
   background-color: #050505;
   /* Deep Obsidian */
   position: relative;
   padding: 60px 20px;
   overflow: hidden;
   /* Keeps the glow contained */
 }

 /* Ambient Glow restricted to the right side */
 .gateway-ambient-glow {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 600px;
   height: 600px;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.08) 0%, transparent 60%);
   pointer-events: none;
   z-index: 0;
 }

 .glass-form-container {
   width: 100%;
   max-width: 600px;
   /* Keeps form perfectly centered and sized */
   background: rgba(255, 255, 255, 0.02);
   backdrop-filter: blur(40px);
   -webkit-backdrop-filter: blur(40px);
   border: 1px solid rgba(255, 255, 255, 0.05);
   border-radius: 32px;
   padding: 60px;
   box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05);
 }

 /* Form Typography (White) */
 .form-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 2rem;
   font-weight: 800;
   color: #ffffff;
   margin-bottom: 8px;
 }

 .form-subtitle {
   font-size: 1rem;
   color: #64748b;
 }

 /* Form Inputs */
 .epic-label {
   display: block;
   font-size: 0.85rem;
   font-weight: 600;
   color: #94a3b8;
   margin-bottom: 10px;
   padding-left: 5px;
 }

 .input-group-epic {
   position: relative;
 }

 .epic-input,
 .epic-select {
   width: 100%;
   background: rgba(255, 255, 255, 0.03);
   border: 1px solid rgba(255, 255, 255, 0.08);
   border-radius: 16px;
   padding: 16px 20px;
   color: #ffffff;
   font-family: 'Inter', sans-serif;
   font-size: 1rem;
   transition: all 0.3s ease;
   outline: none;
 }

 .epic-select {
   appearance: none;
   background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
   background-repeat: no-repeat;
   background-position: right 20px center;
   background-size: 16px;
   cursor: pointer;
 }

 .epic-select option {
   background-color: #0f172a;
   color: #fff;
 }

 /* Icon Inputs */
 .input-icon-wrapper {
   position: relative;
 }

 .input-icon {
   position: absolute;
   left: 20px;
   top: 50%;
   transform: translateY(-50%);
   color: #64748b;
   font-size: 20px;
   transition: color 0.3s ease;
 }

 .epic-input.with-icon {
   padding-left: 55px;
 }

 .epic-input::placeholder {
   color: #a9acb1;
 }

 /* Focus States (Emerald Glow) */
 .epic-input:focus,
 .epic-select:focus {
   background: rgba(255, 255, 255, 0.05);
   border-color: var(--primary-green);
   box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.1);
 }

 .epic-input:focus+.input-icon,
 .input-icon-wrapper:focus-within .input-icon {
   color: var(--primary-green);
 }

 /* Submit Button */
 .btn-epic-submit {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 12px;
   background: var(--primary-green);
   color: #ffffff;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 800;
   font-size: 1.15rem;
   padding: 18px;
   border: none;
   border-radius: 16px;
   cursor: pointer;
   transition: all 0.4s ease;
   box-shadow: 0 10px 25px rgba(16, 185, 129, 0.25);
 }

 .btn-epic-submit:hover {
   background: #047857;
   transform: translateY(-3px);
   box-shadow: 0 15px 35px rgba(16, 185, 129, 0.4);
 }

 .btn-epic-submit .material-symbols-outlined {
   transition: transform 0.3s ease;
 }

 .btn-epic-submit:hover .material-symbols-outlined {
   transform: translateX(5px);
 }

 /* Footer Link */
 .form-footer-link p {
   color: #64748b;
   font-size: 0.95rem;
 }

 .text-glow-link {
   color: var(--primary-green);
   text-decoration: none;
   font-weight: 600;
   transition: all 0.3s;
 }

 .text-glow-link:hover {
   color: #34D399;
   text-shadow: 0 0 15px rgba(16, 185, 129, 0.5);
 }

 /* Mobile Adjustments */
 @media (max-width: 991.98px) {
   .glass-form-container {
     padding: 40px 25px;
     border: none;
     background: transparent;
     box-shadow: none;
   }

   .dark-form-side {
     padding: 40px 0;
   }
 }

 /* --- INVERTED SPLIT LAYOUT MASTER --- */
 .registration-split-wrapper {
   min-height: 100vh;
   font-family: 'Inter', sans-serif;
   overflow-x: hidden;
   background-color: #f8fafc;
   /* Fallback to light side color */
 }

 /* --- LEFT SIDE: DARK, CINEMATIC & CENTERED --- */
 .dark-sidebar {
   background-color: #050505;
   /* Deep Obsidian */
   position: relative;
   overflow: hidden;
 }

 /* Ambient Glow moved to the left */
 .gateway-ambient-glow {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 600px;
   height: 600px;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.1) 0%, transparent 60%);
   pointer-events: none;
   z-index: 0;
 }

 .vault-label-dark {
   display: inline-block;
   font-family: monospace;
   color: var(--primary-green);
   background: rgba(16, 185, 129, 0.1);
   padding: 6px 14px;
   border-radius: 4px;
   font-size: 0.85rem;
   letter-spacing: 1px;
   border: 1px solid rgba(16, 185, 129, 0.2);
 }

 .grand-title-dark {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: clamp(2.5rem, 4vw, 3.5rem);
   font-weight: 900;
   line-height: 1.1;
   letter-spacing: -1.5px;
   color: #ffffff;
 }

 .text-glow-emerald {
   color: var(--primary-green);
   text-shadow: 0 0 30px rgba(16, 185, 129, 0.4);
 }

 .sidebar-lead-dark {
   font-size: 1.15rem;
   color: #94a3b8;
   line-height: 1.7;
 }

 .security-codes-dark {
   font-family: monospace;
   color: #a9acb1;
   font-size: 0.95rem;
 }

 .security-codes-dark strong {
   color: #cbd5e1;
 }


 /* --- RIGHT SIDE: LIGHT & CLEAN --- */
 .light-form-side {
   background-color: #f8fafc;
   /* Very soft, clean slate-white */
   position: relative;
 }

 .light-form-container {
   width: 100%;
   max-width: 650px;
   /* Perfect reading width for forms */
   background: #ffffff;
   border: 1px solid rgba(0, 0, 0, 0.04);
   border-radius: 32px;
   padding: 60px;
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.03);
 }

 /* Form Typography */
 .form-title-light {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 2rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin-bottom: 8px;
 }

 .form-subtitle-light {
   font-size: 1rem;
   color: #64748b;
 }

 /* Form Inputs (Light Theme) */
 .light-label {
   display: block;
   font-size: 0.85rem;
   color: var(--deep-slate);
   margin-bottom: 10px;
   padding-left: 8px;
 }

 .input-group-light {
   position: relative;
 }

 .light-input,
 .light-select {
   width: 100%;
   background-color: #f8fafc;
   border: 2px solid transparent;
   border-radius: 50px;
   /* Modern pill shape */
   padding: 16px 24px;
   font-family: 'Inter', sans-serif;
   font-size: 15px;
   color: var(--deep-slate);
   transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
   outline: none;
 }

 .light-select {
   appearance: none;
   background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
   background-repeat: no-repeat;
   background-position: right 24px center;
   background-size: 16px;
   cursor: pointer;
   padding-right: 50px;
 }

 /* Icon Inputs */
 .input-icon-wrapper-light {
   position: relative;
 }

 .input-icon {
   position: absolute;
   left: 24px;
   top: 50%;
   transform: translateY(-50%);
   color: #94a3b8;
   font-size: 20px;
   transition: color 0.3s ease;
   z-index: 1;
 }

 .light-input.with-icon {
   padding-left: 60px;
   margin-top: 3px;
 }

 .light-input::placeholder {
   color: #94a3b8;
 }

 /* Focus States (White Fill + Green Border) */
 .light-input:focus,
 .light-select:focus {
   background-color: #ffffff;
   border-color: var(--primary-green);
   box-shadow: 0 10px 20px rgba(16, 185, 129, 0.08);
 }

 .input-icon-wrapper-light:focus-within .input-icon {
   color: var(--primary-green);
 }

 /* Submit Button */
 .btn-submit-light {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 12px;
   background: var(--primary-green);
   color: #ffffff;
   font-family: 'Cabinet Grotesk', sans-serif;
   font-weight: 800;
   font-size: 1.15rem;
   padding: 18px;
   border: none;
   border-radius: 50px;
   cursor: pointer;
   transition: all 0.4s ease;
   box-shadow: 0 10px 25px rgba(16, 185, 129, 0.2);
 }

 .btn-submit-light:hover {
   background: #047857;
   transform: translateY(-3px);
   box-shadow: 0 15px 35px rgba(16, 185, 129, 0.3);
 }

 .btn-submit-light .material-symbols-outlined {
   transition: transform 0.3s ease;
 }

 .btn-submit-light:hover .material-symbols-outlined {
   transform: translateX(5px);
 }

 /* Footer Link */
 .form-footer-link-light p {
   color: #64748b;
   font-size: 0.95rem;
 }

 .text-green-link {
   color: var(--primary-green);
   text-decoration: none;
   transition: all 0.3s;
 }

 .text-green-link:hover {
   color: #047857;
 }

 /* Mobile Adjustments */
 @media (max-width: 991.98px) {
   .light-form-container {
     padding: 40px 25px;
     border: none;
     background: transparent;
     box-shadow: none;
   }

   .light-form-side {
     padding: 40px 0;
     background: #ffffff;
   }
 }

 /* --- EXTERNAL PLATFORMS CARD --- */
 .platform-partners-card {
   background: #ffffff;
   border-radius: 24px;
   padding: 40px 50px;
   border: 1px solid rgba(0, 0, 0, 0.04);
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.02);
 }

 .platform-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.6rem;
   font-weight: 800;
   color: var(--deep-slate);
   margin-bottom: 12px;
 }

 .platform-desc {
   font-size: 1.05rem;
   color: #64748b;
   line-height: 1.6;
   margin: 0;
   max-width: 900px;
 }

 .platform-desc strong {
   color: var(--deep-slate);
   font-family: monospace;
   font-size: 1.1rem;
 }

 /* The Logo Grid */
 .platform-logos {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: center;
   gap: 20px 40px;
   margin-top: 40px;
   padding-top: 30px;
   border-top: 1px solid rgba(0, 0, 0, 0.05);
 }

 .partner-logo-link {
   display: flex;
   align-items: center;
   justify-content: center;
   text-decoration: none;
   outline: none;
 }

 .partner-logo {
   height: 28px;
   max-width: 100px;
   width: auto;
   object-fit: contain;
   filter: grayscale(100%);
   /* Makes them uniform silver/gray by default */
   opacity: 0.6;
   transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
 }

 /* Colorize on Hover */
 .partner-logo-link:hover .partner-logo {
   filter: grayscale(0%);
   opacity: 1;
   transform: scale(1.05);
 }

 /* Mobile Adjustments */
 @media (max-width: 991.98px) {
   .platform-partners-card {
     padding: 30px;
   }

   .platform-logos {
     justify-content: center;
     gap: 18px 30px;
   }

   .partner-logo {
     height: 24px;
     max-width: 85px;
   }
 }

 @media (max-width: 575.98px) {
   .platform-logos {
     gap: 16px 24px;
   }

   .partner-logo {
     height: 20px;
     max-width: 75px;
   }
 }

 /* ── Embed Document Panels ── */
 .embed-panel .agp-header {
   position: relative;
 }

 .embed-fullscreen-btn {
   margin-left: auto;
   background: rgba(0, 0, 0, 0.05);
   border: 1px solid rgba(0, 0, 0, 0.08);
   border-radius: 8px;
   width: 36px;
   height: 36px;
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   transition: all 0.25s ease;
   color: var(--deep-slate);
   flex-shrink: 0;
 }

 .embed-fullscreen-btn:hover {
   background: var(--primary-green);
   color: #fff;
   border-color: var(--primary-green);
 }

 .embed-fullscreen-btn .material-symbols-outlined {
   font-size: 20px;
 }

 .embed-iframe-wrap {
   width: 100%;
   overflow: hidden;
   border-radius: 0 0 12px 12px;
 }

 .embed-iframe-wrap iframe {
   width: 100%;
   height: 600px;
   border: none;
   background: #fff;
 }

 /* Fullscreen mode */
 .embed-panel.is-fullscreen {
   position: fixed;
   top: 0;
   left: 0;
   width: 100vw;
   height: 100vh;
   z-index: 99999;
   border-radius: 0;
   margin: 0;
   display: flex;
   flex-direction: column;
 }

 .embed-panel.is-fullscreen .agp-header {
   border-radius: 0;
   flex-shrink: 0;
 }

 .embed-panel.is-fullscreen .embed-iframe-wrap {
   flex: 1;
   border-radius: 0;
 }

 .embed-panel.is-fullscreen .embed-iframe-wrap iframe {
   height: 100%;
 }

 .embed-panel.is-fullscreen .embed-fullscreen-btn {
   background: rgba(220, 53, 69, 0.1);
   color: #dc3545;
   border-color: rgba(220, 53, 69, 0.2);
 }

 .embed-panel.is-fullscreen .embed-fullscreen-btn:hover {
   background: #dc3545;
   color: #fff;
   border-color: #dc3545;
 }

 /* A4 document embed – compact card in row */
 .embed-a4 .agp-header {
   padding: 16px 20px;
 }

 .embed-a4 .agp-title {
   font-size: 0.95rem;
 }

 .embed-a4 .embed-iframe-wrap {
   overflow: hidden;
   aspect-ratio: 1 / 1.44;
 }

 .embed-a4 .embed-iframe-wrap iframe {
   width: calc(100% + 20px);
   height: calc(100% + 20px);
   margin: -10px;
   pointer-events: none;
 }

 .embed-a4:hover .embed-iframe-wrap iframe {
   pointer-events: auto;
 }

 .embed-a4 .embed-fullscreen-btn {
   width: 30px;
   height: 30px;
 }

 .embed-a4 .embed-fullscreen-btn .material-symbols-outlined {
   font-size: 17px;
 }

 /* A4 fullscreen overrides */
 .embed-a4.is-fullscreen .agp-header {
   padding: 28px 36px;
 }

 .embed-a4.is-fullscreen .agp-title {
   font-size: 1.15rem;
 }

 .embed-a4.is-fullscreen .embed-iframe-wrap {
   aspect-ratio: auto;
   overflow: hidden;
 }

 .embed-a4.is-fullscreen .embed-iframe-wrap iframe {
   width: calc(100% + 20px);
   height: calc(100% + 20px);
   margin: -10px;
   pointer-events: auto;
 }

 .embed-a4.is-fullscreen .embed-fullscreen-btn {
   width: 36px;
   height: 36px;
 }

 .embed-a4.is-fullscreen .embed-fullscreen-btn .material-symbols-outlined {
   font-size: 20px;
 }

 body.embed-fullscreen-active {
   overflow: hidden;
 }

 /* ── Glass Toast Notifications ── */
 .glass-toast-container {
   position: fixed;
   top: 24px;
   right: 24px;
   z-index: 999999;
   display: flex;
   flex-direction: column;
   gap: 10px;
   pointer-events: none;
 }

 .glass-toast {
   display: flex;
   align-items: center;
   gap: 12px;
   min-width: 320px;
   max-width: 480px;
   padding: 14px 16px;
   border-radius: 12px;
   background: rgba(255, 255, 255, 0.92);
   backdrop-filter: blur(16px);
   -webkit-backdrop-filter: blur(16px);
   box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
   border: 1px solid rgba(255, 255, 255, 0.6);
   pointer-events: auto;
   cursor: pointer;
   position: relative;
   overflow: hidden;
   transform: translateX(120%);
   opacity: 0;
   transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.4s ease;
 }

 .glass-toast.show {
   transform: translateX(0);
   opacity: 1;
 }

 .glass-toast.hiding {
   transform: translateX(120%);
   opacity: 0;
   transition: transform 0.3s ease-in, opacity 0.3s ease;
 }

 .glass-toast-icon {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 36px;
   height: 36px;
   border-radius: 10px;
   flex-shrink: 0;
 }

 .glass-toast-icon .material-symbols-outlined {
   font-size: 20px;
 }

 .toast-success .glass-toast-icon {
   background: rgba(22, 163, 74, 0.1);
   color: #16A34A;
 }

 .toast-error .glass-toast-icon {
   background: rgba(239, 68, 68, 0.1);
   color: #ef4444;
 }

 .toast-warning .glass-toast-icon {
   background: rgba(245, 158, 11, 0.1);
   color: #f59e0b;
 }

 .toast-info .glass-toast-icon {
   background: rgba(59, 130, 246, 0.1);
   color: #3b82f6;
 }

 .glass-toast-body {
   flex: 1;
   min-width: 0;
 }

 .glass-toast-message {
   font-family: 'DM Sans', sans-serif;
   font-size: 0.88rem;
   font-weight: 500;
   color: #1e293b;
   line-height: 1.4;
 }

 .glass-toast-close {
   display: flex;
   align-items: center;
   justify-content: center;
   background: none;
   border: none;
   color: #94a3b8;
   cursor: pointer;
   padding: 4px;
   border-radius: 6px;
   flex-shrink: 0;
   transition: all 0.2s;
 }

 .glass-toast-close:hover {
   background: rgba(0, 0, 0, 0.05);
   color: #475569;
 }

 .glass-toast-close .material-symbols-outlined {
   font-size: 18px;
 }

 .glass-toast-progress {
   position: absolute;
   bottom: 0;
   left: 0;
   height: 3px;
   border-radius: 0 0 12px 12px;
   transition-property: width;
   transition-timing-function: linear;
 }

 .toast-success .glass-toast-progress {
   background: #16A34A;
 }

 .toast-error .glass-toast-progress {
   background: #ef4444;
 }

 .toast-warning .glass-toast-progress {
   background: #f59e0b;
 }

 .toast-info .glass-toast-progress {
   background: #3b82f6;
 }

 @media (max-width: 480px) {
   .glass-toast-container {
     top: auto;
     bottom: 16px;
     right: 16px;
     left: 16px;
   }

   .glass-toast {
     min-width: 0;
     max-width: none;
   }
 }

 /* ==========================================
    HOME PAGE: AI Section
    ========================================== */

 .section-ai-home {
   background-color: var(--dark-bg);
   padding: 160px 0;
   position: relative;
   overflow: hidden;
   color: #ffffff;
 }

 .ai-home-mesh {
   position: absolute;
   top: -20%;
   left: -10%;
   width: 70vw;
   height: 70vw;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.1) 0%, transparent 65%);
   filter: blur(120px);
   animation: floatLight 18s infinite ease-in-out;
   pointer-events: none;
   z-index: 0;
 }

 .ai-home-grid-pattern {
   position: absolute;
   inset: 0;
   background-image:
     linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px),
     linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
   background-size: 60px 60px;
   pointer-events: none;
   z-index: 0;
 }

 .ai-home-content {
   position: relative;
   z-index: 2;
   max-width: 540px;
 }

 .ai-home-desc {
   font-size: 1.15rem;
   color: var(--text-muted);
   line-height: 1.7;
   margin-bottom: 10px;
 }

 .ai-feature-cards-stack {
   position: relative;
   z-index: 2;
   display: flex;
   flex-direction: column;
   gap: 24px;
 }

 .ai-preview-card {
   display: flex;
   align-items: flex-start;
   gap: 24px;
   padding: 36px 32px;
   background: rgba(255, 255, 255, 0.03);
   border: 1px solid rgba(255, 255, 255, 0.08);
   border-radius: 24px;
   backdrop-filter: blur(20px);
   -webkit-backdrop-filter: blur(20px);
   position: relative;
   overflow: hidden;
   transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
 }

 .ai-preview-card:hover {
   border-color: rgba(16, 185, 129, 0.3);
   background: rgba(16, 185, 129, 0.05);
   transform: translateX(-8px);
 }

 .ai-preview-icon {
   flex-shrink: 0;
   width: 56px;
   height: 56px;
   border-radius: 16px;
   background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(16, 185, 129, 0.05) 100%);
   border: 1px solid rgba(16, 185, 129, 0.2);
   display: flex;
   align-items: center;
   justify-content: center;
   transition: all 0.4s ease;
 }

 .ai-preview-card:hover .ai-preview-icon {
   background: linear-gradient(135deg, var(--primary-green) 0%, #047857 100%);
   border-color: transparent;
   box-shadow: 0 8px 24px rgba(16, 185, 129, 0.3);
 }

 .ai-preview-icon .material-symbols-outlined {
   color: var(--primary-green);
   font-size: 26px;
   font-variation-settings: 'FILL' 1, 'wght' 300;
   transition: color 0.4s ease;
 }

 .ai-preview-card:hover .ai-preview-icon .material-symbols-outlined {
   color: #ffffff;
 }

 .ai-preview-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 1.2rem;
   font-weight: 800;
   color: #ffffff;
   margin-bottom: 8px;
   letter-spacing: -0.3px;
 }

 .ai-preview-text {
   font-size: 0.95rem;
   color: var(--text-muted);
   line-height: 1.6;
   margin: 0;
 }

 .ai-preview-glow {
   position: absolute;
   top: -50%;
   right: -20%;
   width: 200px;
   height: 200px;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.08) 0%, transparent 70%);
   pointer-events: none;
 }

 /* AI floating particles */
 .ai-particle {
   position: absolute;
   border-radius: 50%;
   background: var(--primary-green);
   opacity: 0.15;
   pointer-events: none;
   z-index: 1;
 }

 .ai-particle-1 {
   width: 6px;
   height: 6px;
   top: 10%;
   right: 15%;
   animation: aiFloat 8s ease-in-out infinite;
 }

 .ai-particle-2 {
   width: 4px;
   height: 4px;
   top: 50%;
   right: 5%;
   animation: aiFloat 12s ease-in-out infinite 2s;
 }

 .ai-particle-3 {
   width: 8px;
   height: 8px;
   bottom: 10%;
   right: 25%;
   animation: aiFloat 10s ease-in-out infinite 4s;
 }

 @keyframes aiFloat {
   0%, 100% { transform: translateY(0) translateX(0); opacity: 0.15; }
   25% { transform: translateY(-20px) translateX(10px); opacity: 0.3; }
   50% { transform: translateY(-10px) translateX(-5px); opacity: 0.1; }
   75% { transform: translateY(-25px) translateX(15px); opacity: 0.25; }
 }

 /* ==========================================
    AI FEATURES PAGE
    ========================================== */

 /* AI Hero */
 .ai-hero {
   background-color: var(--dark-bg);
   min-height: 85vh;
   display: flex;
   align-items: center;
   position: relative;
   overflow: hidden;
   padding: 160px 0 100px;
   color: #fff;
 }

 .ai-hero-mesh {
   position: absolute;
   top: -10%;
   left: 50%;
   transform: translateX(-50%);
   width: 80vw;
   height: 80vw;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.12) 0%, transparent 60%);
   filter: blur(120px);
   animation: floatLight 18s infinite ease-in-out;
   pointer-events: none;
   z-index: 0;
 }

 .ai-hero-grid {
   position: absolute;
   inset: 0;
   background-image:
     linear-gradient(rgba(255, 255, 255, 0.015) 1px, transparent 1px),
     linear-gradient(90deg, rgba(255, 255, 255, 0.015) 1px, transparent 1px);
   background-size: 80px 80px;
   pointer-events: none;
   z-index: 0;
   mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
   -webkit-mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
 }

 .ai-hero-headline {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: clamp(3.5rem, 8vw, 6.5rem);
   font-weight: 800;
   line-height: 0.95;
   letter-spacing: -4px;
   margin-bottom: 2rem;
 }

 .ai-hero-subtitle {
   font-size: 1.25rem;
   color: var(--text-muted);
   max-width: 700px;
   margin: 0 auto 3.5rem;
   line-height: 1.7;
 }

 /* Neural network visual */
 .ai-hero-visual {
   position: relative;
   width: 180px;
   height: 180px;
   margin: 0 auto;
 }

 .neural-ring {
   position: absolute;
   border-radius: 50%;
   border: 1px solid rgba(16, 185, 129, 0.15);
 }

 .neural-ring-1 {
   inset: 0;
   animation: neuralPulse 4s ease-in-out infinite;
 }

 .neural-ring-2 {
   inset: 20px;
   border-color: rgba(16, 185, 129, 0.25);
   animation: neuralPulse 4s ease-in-out infinite 0.5s;
 }

 .neural-ring-3 {
   inset: 40px;
   border-color: rgba(16, 185, 129, 0.35);
   animation: neuralPulse 4s ease-in-out infinite 1s;
 }

 .neural-core {
   position: absolute;
   inset: 55px;
   border-radius: 50%;
   background: linear-gradient(135deg, var(--primary-green) 0%, #047857 100%);
   display: flex;
   align-items: center;
   justify-content: center;
   box-shadow: 0 0 60px rgba(16, 185, 129, 0.3), 0 0 120px rgba(16, 185, 129, 0.1);
 }

 .neural-core .material-symbols-outlined {
   color: #ffffff;
   font-size: 36px;
   font-variation-settings: 'FILL' 1, 'wght' 300;
 }

 @keyframes neuralPulse {
   0%, 100% { transform: scale(1); opacity: 1; }
   50% { transform: scale(1.08); opacity: 0.5; }
 }

 /* AI Introduction Section */
 .ai-intro-section {
   background: #ffffff;
   padding: 120px 0;
   position: relative;
 }

 .ai-intro-card {
   background: #ffffff;
   border: 1px solid rgba(0, 0, 0, 0.06);
   border-radius: 32px;
   padding: 70px 60px;
   box-shadow: 0 30px 80px rgba(0, 0, 0, 0.04);
   text-align: center;
   position: relative;
   overflow: hidden;
 }

 .ai-intro-card::before {
   content: '';
   position: absolute;
   top: 0;
   left: 50%;
   transform: translateX(-50%);
   width: 200px;
   height: 3px;
   background: linear-gradient(90deg, transparent, var(--primary-green), transparent);
   border-radius: 2px;
 }

 .ai-intro-badge {
   margin-bottom: 28px;
 }

 .ai-intro-text {
   font-size: 1.2rem;
   color: #64748b;
   line-height: 1.8;
   max-width: 750px;
   margin: 0 auto 48px;
 }

 .ai-intro-metrics {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 40px;
   padding-top: 40px;
   border-top: 1px solid rgba(0, 0, 0, 0.06);
 }

 .ai-metric-item {
   display: flex;
   align-items: center;
   gap: 12px;
 }

 .ai-metric-item .material-symbols-outlined {
   font-size: 24px;
   color: var(--primary-green);
   font-variation-settings: 'FILL' 1, 'wght' 300;
 }

 .ai-metric-label {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 0.95rem;
   font-weight: 700;
   color: var(--deep-slate);
   letter-spacing: -0.2px;
 }

 .ai-metric-divider {
   width: 1px;
   height: 28px;
   background: rgba(0, 0, 0, 0.08);
 }

 /* AI Detail Section */
 .ai-detail-section {
   background: #f8faf9;
   padding: 140px 0;
   position: relative;
 }

 .ai-detail-row {
   margin-bottom: 100px;
   position: relative;
 }

 .ai-detail-row:last-child {
   margin-bottom: 0;
 }

 /* Visual orb element */
 .ai-detail-visual {
   position: relative;
   width: 280px;
   height: 280px;
   margin: 0 auto;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .ai-visual-orb {
   width: 120px;
   height: 120px;
   border-radius: 50%;
   background: linear-gradient(135deg, rgba(16, 185, 129, 0.1) 0%, rgba(16, 185, 129, 0.03) 100%);
   border: 1px solid rgba(16, 185, 129, 0.2);
   display: flex;
   align-items: center;
   justify-content: center;
   position: relative;
   z-index: 2;
   transition: all 0.5s ease;
 }

 .ai-visual-orb .material-symbols-outlined {
   font-size: 48px;
   color: var(--primary-green);
   font-variation-settings: 'FILL' 0, 'wght' 200;
 }

 .ai-visual-orb.purple {
   background: linear-gradient(135deg, rgba(99, 102, 241, 0.1) 0%, rgba(99, 102, 241, 0.03) 100%);
   border-color: rgba(99, 102, 241, 0.2);
 }

 .ai-visual-orb.purple .material-symbols-outlined {
   color: #6366f1;
 }

 .ai-visual-orb.amber {
   background: linear-gradient(135deg, rgba(245, 158, 11, 0.1) 0%, rgba(245, 158, 11, 0.03) 100%);
   border-color: rgba(245, 158, 11, 0.2);
 }

 .ai-visual-orb.amber .material-symbols-outlined {
   color: #f59e0b;
 }

 .ai-visual-ring {
   position: absolute;
   inset: 30px;
   border-radius: 50%;
   border: 1px dashed rgba(16, 185, 129, 0.15);
   animation: slowSpin 30s linear infinite;
 }

 .ai-visual-ring.purple {
   border-color: rgba(99, 102, 241, 0.15);
 }

 .ai-visual-ring.amber {
   border-color: rgba(245, 158, 11, 0.15);
 }

 @keyframes slowSpin {
   from { transform: rotate(0deg); }
   to { transform: rotate(360deg); }
 }

 .ai-visual-dots {
   position: absolute;
   inset: 0;
   animation: slowSpin 20s linear infinite reverse;
 }

 .ai-visual-dots span {
   position: absolute;
   width: 6px;
   height: 6px;
   border-radius: 50%;
   background: var(--primary-green);
   opacity: 0.4;
 }

 .ai-visual-dots span:nth-child(1) { top: 0; left: 50%; transform: translateX(-50%); }
 .ai-visual-dots span:nth-child(2) { top: 25%; right: 5%; }
 .ai-visual-dots span:nth-child(3) { bottom: 10%; right: 10%; }
 .ai-visual-dots span:nth-child(4) { bottom: 5%; left: 20%; }
 .ai-visual-dots span:nth-child(5) { top: 30%; left: 2%; }

 .ai-visual-dots.purple span { background: #6366f1; }
 .ai-visual-dots.amber span { background: #f59e0b; }

 /* Detail content */
 .ai-detail-content {
   max-width: 560px;
 }

 .ai-detail-number {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: 5rem;
   font-weight: 900;
   line-height: 0.8;
   color: rgba(16, 185, 129, 0.1);
   margin-bottom: 20px;
   letter-spacing: -2px;
 }

 .ai-detail-title {
   font-family: 'Cabinet Grotesk', sans-serif;
   font-size: clamp(1.6rem, 2.5vw, 2.2rem);
   font-weight: 800;
   color: var(--deep-slate);
   margin-bottom: 20px;
   letter-spacing: -1px;
   line-height: 1.15;
 }

 .ai-detail-text {
   font-size: 1.1rem;
   color: #64748b;
   line-height: 1.75;
   margin: 0;
 }

 /* AI CTA Section */
 .ai-cta-section {
   background-color: var(--dark-bg);
   padding: 140px 0;
   position: relative;
   overflow: hidden;
 }

 .ai-cta-mesh {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 60vw;
   height: 60vw;
   background: radial-gradient(circle, rgba(16, 185, 129, 0.1) 0%, transparent 60%);
   filter: blur(100px);
   pointer-events: none;
   z-index: 0;
 }

 .ai-cta-text {
   font-size: 1.2rem;
   color: var(--text-muted);
   line-height: 1.7;
   max-width: 600px;
   margin: 0 auto 40px;
 }

 .ai-cta-btn {
   display: inline-flex;
   margin: 0 auto;
 }