
                 *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
         :root {
         --white:#FFFFFF; --off:#F7F5F3; --light:#F2EFEC; --border:#E4E0DB;
         --muted:#8C7B6E; --text:#1C1410; --sub:#5C4D42;
         --red:#FF3621; --orange:#FF6B35; --amber:#FF9A00; --dark-red:#CC2A18; --ink:#1C1410;
         }
         html { scroll-behavior: smooth; }
         body { font-family: 'Mulish', sans-serif; background: var(--white); color: var(--text); overflow-x: hidden; }
         .hero { min-height: 100vh; padding: 72px 0 0; display: grid; grid-template-columns: 1fr 1fr; }
         .hero-left { background: #2a2a2a; padding: 100px 80px 80px 64px; display: flex; flex-direction: column; justify-content: center; position: relative; overflow: hidden; }
         .hero-left::before { content: ''; position: absolute; bottom: 0; right: 0; width: 300px; height: 300px; background: radial-gradient(circle, rgba(255,54,33,0.15), transparent 70%); }
         .partner-strip { display: flex; align-items: center; gap: 12px; margin-bottom: 48px; flex-wrap: wrap; }
         .p-chip { background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.12); border-radius: 4px; padding: 6px 14px; font-size: 12px; font-weight: 700; color: rgba(255,255,255,0.7); letter-spacing: 1.5px; text-transform: uppercase; }
         .p-chip.active { background: rgba(255,54,33,0.15); border-color: rgba(255,54,33,0.4); color: #00a1e0; }
         .p-divider { width: 1px; height: 20px; background: rgba(255,255,255,0.15); }
         .hero h1 { font-family: 'Playfair Display', serif; font-size: clamp(36px, 4vw, 60px); font-weight: 700; line-height: 1.1; letter-spacing: -1px; color: var(--white); margin-bottom: 24px; }
         .hero h1 span { color: #00a1e0; }
         .hero-desc { font-size: 16px; font-weight: 300; line-height: 1.8; color: rgba(255,255,255,0.55); margin-bottom: 48px; max-width: 440px; }
         .hero-btns { display: flex; gap: 14px; }
         .btn-primary { background: #00a1e0; color: var(--white); padding: 14px 28px; border-radius: 4px; font-size: 13px; font-weight: 700; text-decoration: none; text-transform: uppercase; letter-spacing: 0.5px; transition: background 0.2s; }
         .btn-primary:hover { background: #1381ac; }
         .btn-outline-light { border: 1px solid rgba(255,255,255,0.2); color: rgba(255,255,255,0.8); padding: 14px 28px; border-radius: 4px; font-size: 13px; font-weight: 600; text-decoration: none; text-transform: uppercase; letter-spacing: 0.5px; transition: all 0.2s; }
         .btn-outline-light:hover { border-color: rgba(255,255,255,0.5); color: var(--white); }
         .hero-right { background: var(--off); padding: 100px 64px 80px; display: flex; flex-direction: column; justify-content: center; border-left: 1px solid var(--border); }
         .hero-badge { display: inline-flex; align-items: center; gap: 8px; background: var(--white); border: 1px solid var(--border); border-radius: 4px; padding: 8px 16px; margin-bottom: 40px; width: fit-content; }
         .badge-dot { width: 8px; height: 8px; border-radius: 50%; background: #00a1e0; animation: pulse 2s infinite; }
         @keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.4} }
         .badge-text { font-size: 12px; font-weight: 700; color: var(--text); letter-spacing: 1px; text-transform: uppercase; }
         .stat-list { display: flex; flex-direction: column; gap: 0; margin-bottom: 40px; }
         .stat-row { display: flex; align-items: center; justify-content: space-between; padding: 22px 0; border-bottom: 1px solid var(--border); }
         .stat-row:first-child { border-top: 1px solid var(--border); }
         .stat-label { font-size: 13px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: 0.5px; }
         .stat-value { font-family: 'Playfair Display', serif; font-size: 26px; font-weight: 700; color: var(--text); letter-spacing: -0.5px; }
         .stat-value em { font-style: normal; color: #00a1e0; }
         .hero-note { background: var(--white); border: 1px solid var(--border); border-left: 3px solid #00a1e0; border-radius: 4px; padding: 18px 20px; font-size: 13px; font-weight: 400; color: var(--sub); line-height: 1.6; }
         section { padding: 96px 64px; }
         .container { max-width: 1160px; margin: 0 auto; }
         .label-row { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
         .section-label { font-size: 11px; font-weight: 700; color: #00a1e0; letter-spacing: 2.5px; text-transform: uppercase; white-space: nowrap; }
         .label-line { flex: 1; height: 1px; background: var(--border); }
         .section-title { font-family: 'Playfair Display', serif; font-size: clamp(28px, 3.5vw, 46px); font-weight: 700; line-height: 1.12; letter-spacing: -1px; color: #2a2a2a; margin-bottom: 14px; }
         .section-sub { font-size: 15px; font-weight: 300; line-height: 1.8; color: var(--sub); max-width: 520px; }
         .what { background: var(--white); }
         .what-layout { display: grid; grid-template-columns: 5fr 4fr; gap: 72px; align-items: start; margin-top: 56px; }
         .lakehouse { border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
         .lh-header { background: #2a2a2a; padding: 18px 24px; display: flex; align-items: center; gap: 10px; }
         .lh-header span { font-size: 13px; font-weight: 700; color: rgba(255,255,255,0.7); letter-spacing: 0.5px; }
         .lh-dot { width: 6px; height: 6px; border-radius: 50%; background: #00a1e0; }
         .lh-layer { display: flex; align-items: center; gap: 14px; padding: 18px 24px; border-bottom: 1px solid var(--border); transition: background 0.2s; }
         .lh-layer:last-child { border-bottom: none; }
         .lh-layer:hover { background: var(--off); }
         .lh-icon { font-size: 22px; flex-shrink: 0; }
         .lh-info { flex: 1; }
         .lh-name { font-size: 14px; font-weight: 700; color: #2a2a2a; }
         .lh-desc { font-size: 12px; color: var(--muted); margin-top: 2px; }
         .lh-badge { background: rgba(255,54,33,0.08); border: 1px solid rgba(255,54,33,0.2); color: #00a1e0; font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 3px; letter-spacing: 1px; text-transform: uppercase; flex-shrink: 0; }
         .what-points { display: flex; flex-direction: column; gap: 28px; }
         .wp { padding-bottom: 28px; border-bottom: 1px solid var(--border); }
         .wp:last-child { border-bottom: none; padding-bottom: 0; }
         .wp-num { font-family: 'Playfair Display', serif; font-size: 13px; font-weight: 600; color: #00a1e0; margin-bottom: 6px; }
         .wp h4 { font-size: 16px; font-weight: 700; color: #2a2a2a; margin-bottom: 8px; }
         .wp p { font-size: 14px; color: var(--sub); line-height: 1.7; }
         .capabilities { background: var(--off); }
         .caps-header { margin-bottom: 48px; }
         .caps-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
         .cap { padding: 32px 28px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--white); transition: background 0.2s; }
         .cap:hover { background: var(--off); }
         .cap:nth-child(3n) { border-right: none; }
         .cap:nth-child(4),.cap:nth-child(5),.cap:nth-child(6) { border-bottom: none; }
         .cap-icon { font-size: 24px; margin-bottom: 12px; display: block; }
         .cap-num { font-size: 11px; font-weight: 700; color: #00a1e0; letter-spacing: 1.5px; margin-bottom: 6px; text-transform: uppercase; }
         .cap h3 { font-size: 16px; font-weight: 700; color: #2a2a2a; margin-bottom: 8px; }
         .cap p { font-size: 13px; color: var(--sub); line-height: 1.7; }
         .cap-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
         .ctag { background: var(--off); border: 1px solid var(--border); color: var(--muted); font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 3px; letter-spacing: 0.5px; text-transform: uppercase; }
         .usecases { background: var(--white); }
         .uc-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin-top: 48px; background: var(--border); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
         .uc { background: var(--white); padding: 36px 32px; transition: background 0.2s; }
         .uc:hover { background: var(--off); }
         .uc-top { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 14px; }
         .uc-icon { width: 44px; height: 44px; border-radius: 8px; background: rgba(255,54,33,0.08); border: 1px solid rgba(255,54,33,0.15); display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
         .uc h3 { font-family: 'Playfair Display', serif; font-size: 17px; font-weight: 600; color: #2a2a2a; padding-top: 4px; }
         .uc p { font-size: 13px; color: var(--sub); line-height: 1.75; margin-bottom: 14px; }
         .uc-list { list-style: none; display: flex; flex-direction: column; gap: 6px; }
         .uc-list li { font-size: 12px; font-weight: 600; color: var(--sub); padding-left: 16px; position: relative; text-transform: uppercase; letter-spacing: 0.3px; }
         .uc-list li::before { content: 'â€”'; position: absolute; left: 0; color: #00a1e0; }
         .services { background: #006086ed; }
         .services .section-label { color: #00dfff; }
         .services .section-title { color: var(--white); }
         .services .section-sub { color: rgba(255,255,255,0.45); }
         .svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 48px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.08); border-radius: 8px; overflow: hidden; }
         .svc { background: #2a2a2a; padding: 32px 26px; transition: background 0.2s; position: relative; }
         .svc::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, #00a1e0, #00dfff); transform: scaleX(0); transform-origin: left; transition: transform 0.3s; }
         .svc:hover { background: #1381ac; }
         .svc:hover p { color: #ffebdb; }
         .svc:hover::after { transform: scaleX(1); }
         .svc-n { font-family: 'Playfair Display', serif; font-size: 36px; font-weight: 700; 
            color: rgb(255 255 255 / 50%); margin-bottom: 14px; line-height: 1; }
         .svc h3 { font-size: 15px; font-weight: 700; color: var(--white); margin-bottom: 8px; }
         .svc p { font-size: 13px; color: var(--muted); line-height: 1.7; }
         .svc-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
         .stag { background: rgba(255,106,53,0.1); border: 1px solid rgba(255,106,53,0.2); color: #00dfff; font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 3px; letter-spacing: 0.5px; text-transform: uppercase; }
         .numbers { background: #006086ed; }
         .num-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
         .num-item { padding: 52px 40px; border-right: 1px solid rgba(255,255,255,0.2); text-align: center; }
         .num-item:last-child { border-right: none; }
         .num-val { font-family: 'Playfair Display', serif; font-size: 48px; font-weight: 700; color: var(--white); line-height: 1; letter-spacing: -2px; margin-bottom: 8px; }
         .num-label { font-size: 12px; font-weight: 600; color: rgba(255,255,255,0.65); text-transform: uppercase; letter-spacing: 1px; }
         .techstack { background: var(--off); }
         .stack-table { width: 100%; border-collapse: collapse; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; margin-top: 48px; }
         .stack-table th { background: #2a2a2a; color: rgba(255,255,255,0.7); font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; padding: 16px 24px; text-align: left; border-right: 1px solid rgba(255,255,255,0.08); }
         .stack-table th:last-child { border-right: none; }
         .stack-table td { padding: 18px 24px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); font-size: 13px; color: var(--sub); font-weight: 500; vertical-align: middle; }
         .stack-table td:last-child { border-right: none; }
         .stack-table tr:last-child td { border-bottom: none; }
         .stack-table tr:hover td { background: var(--white); }
         .stack-cat { font-size: 11px; font-weight: 700; color: #00a1e0; text-transform: uppercase; letter-spacing: 1px; white-space: nowrap; }
         .stack-tools { display: flex; flex-wrap: wrap; gap: 6px; }
         .tool-chip { background: var(--white); border: 1px solid var(--border); border-radius: 3px; padding: 4px 10px; font-size: 12px; font-weight: 600; color: #2a2a2a; }
         .personas { background: var(--white); }
         .p-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }
         .persona { border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
         .persona-head { background: var(--off); padding: 22px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 14px; }
         .p-avatar { width: 44px; height: 44px; border-radius: 50%; background: #2a2a2a; display: flex; align-items: center; justify-content: center; font-size: 18px; flex-shrink: 0; }
         .persona h3 { font-size: 15px; font-weight: 700; color: #2a2a2a; margin-bottom: 2px; }
         .p-role { font-size: 10px; font-weight: 700; color: #00a1e0; letter-spacing: 1px; text-transform: uppercase; }
         .persona-body { padding: 22px; }
         .persona-body ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }
         .persona-body ul li { font-size: 13px; color: var(--sub); padding-left: 18px; position: relative; line-height: 1.55; }
         .persona-body ul li::before { content: 'â†’'; position: absolute; left: 0; color: #00a1e0; font-size: 11px; font-weight: 700; }
         .process { background: var(--off); }
         .process-table { margin-top: 48px; }
         .process-row { display: grid; grid-template-columns: 72px 1fr 1fr; border-bottom: 1px solid var(--border); transition: background 0.2s; }
         .process-row:first-child { border-top: 1px solid var(--border); }
         .process-row:hover { background: var(--white); }
         .pr-num { padding: 26px 20px; font-family: 'Playfair Display', serif; font-size: 20px; font-weight: 700; color: #00a1e0; border-right: 1px solid var(--border); display: flex; align-items: center; }
         .pr-title { padding: 26px 28px; font-size: 15px; font-weight: 700; color: #2a2a2a; border-right: 1px solid var(--border); display: flex; align-items: center; }
         .pr-desc { padding: 26px 28px; font-size: 13px; color: var(--sub); line-height: 1.7; display: flex; align-items: center; }
         .cta { background: #fff; padding: 96px 64px; }
       
         .cta h2 { font-family: 'Playfair Display', serif; font-size: clamp(28px, 3vw, 44px); font-weight: 700; color: #2a2a2a; line-height: 1.15; letter-spacing: -1px; margin-bottom: 16px; }
         .cta p { font-size: 15px; color: rgba(255,255,255,0.45); line-height: 1.75; margin-bottom: 32px; }
         .cta-btns { display: flex; gap: 14px; flex-wrap: wrap; }
        
      
      
       
      
         @keyframes fadeUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
         .fade { animation: fadeUp 0.65s ease both; }
         .d1{animation-delay:0.05s} .d2{animation-delay:0.15s} .d3{animation-delay:0.25s} .d4{animation-delay:0.35s}
         @media(max-width:1024px){
         section{padding:72px 24px}
         .hero{grid-template-columns:1fr}
         .hero-left{padding:100px 24px 64px} .hero-right{padding:64px 24px}
         .what-layout,.cta-inner{grid-template-columns:1fr;gap:40px}
         .caps-grid{grid-template-columns:1fr}
         .cap:nth-child(n){border-right:none;border-bottom:1px solid var(--border)} .cap:last-child{border-bottom:none}
         .uc-grid{grid-template-columns:1fr}
         .svc-grid{grid-template-columns:1fr}
         .p-grid{grid-template-columns:1fr}
         .num-grid{grid-template-columns:repeat(2,1fr)}
         .num-item:nth-child(2){border-right:none}
         .num-item:nth-child(3){border-right:1px solid rgba(255,255,255,0.2);border-top:1px solid rgba(255,255,255,0.2)}
         .num-item:nth-child(4){border-top:1px solid rgba(255,255,255,0.2)}
         .process-row{grid-template-columns:60px 1fr} .pr-desc{display:none}
         }