/* SHARK IT v6 — full-viewport corporate presentation */
:root{scrollbar-gutter:auto}
body.redesign-v5{padding:12px 12px 24px;background:#E5ECF8;overflow-x:clip}
body.redesign-v5>.shell{max-width:none!important;width:100%!important;margin:0 auto!important;padding:0!important}
.redesign-v5 .design-reference,.redesign-v5 .design-inner{width:100%;max-width:none!important}
.redesign-v5 .design-reference .design-inner{gap:clamp(24px,3.5vw,48px)}
.redesign-v5 .design-reference .nav-links{gap:clamp(12px,1.75vw,28px)!important}
.redesign-v5 .design-reference .nav-links .nav-link{font-size:clamp(12px,.94vw,15px)!important;white-space:nowrap}
.redesign-v5 .design-reference header{padding-left:clamp(14px,2.8vw,64px)!important;padding-right:clamp(14px,2.8vw,64px)!important}
.redesign-v5 .design-reference #top{padding-left:clamp(24px,4vw,90px)!important;padding-right:clamp(24px,4vw,90px)!important;min-height:clamp(520px,62vw,790px)}
.redesign-v5 .design-reference #top h1{font-size:clamp(34px,4.4vw,75px)!important}
.redesign-v5 .design-reference .ref-lang .language-panel{position:absolute!important;right:0!important;top:calc(100% + 12px)!important;z-index:500!important}
.redesign-v5 .design-reference .ref-lang{isolation:isolate;z-index:150!important}
.redesign-v5 .design-reference header{z-index:100!important}
.redesign-v5 .design-reference .ref-mobile-menu{position:relative;z-index:90!important}
.redesign-v5 .section{padding-left:clamp(24px,4.5vw,90px);padding-right:clamp(24px,4.5vw,90px)}
.redesign-v5 .section .section-heading{max-width:900px}
.redesign-v5 .services-grid,.redesign-v5 .process-grid,.redesign-v5 .portfolio-grid{gap:clamp(18px,2vw,32px)}
.redesign-v5 .about-panel,.redesign-v5 .contact-shell,.redesign-v5 .portfolio-section{border-radius:36px}
.redesign-v5 .portfolio-section{padding:clamp(34px,4.8vw,86px)!important}
.redesign-v5 .footer{margin:36px 0 0;width:100%;padding:36px clamp(28px,5vw,100px)}
.redesign-v5 .portfolio-detail{width:100%}
.redesign-v5.portfolio-detail-body .portfolio-detail{padding:clamp(30px,5vw,92px);max-width:none}
.redesign-v5.portfolio-detail-body .header{padding-left:clamp(20px,5vw,90px);padding-right:clamp(20px,5vw,90px)}

/* Common editorial typography */
.expanded-section{width:100%;position:relative;scroll-margin-top:35px}
.expanded-head{margin-bottom:36px;max-width:850px}
.expanded-head h2,.faq-heading h2,.stack-intro h2,.careers-intro h2{color:#081A35;font-family:'Unbounded','Onest',sans-serif;font-size:clamp(27px,3vw,51px);font-weight:500;line-height:1.18;letter-spacing:-.035em;margin:12px 0 16px;text-wrap:balance}
.expanded-head>p,.stack-intro>p,.careers-intro>p{color:#52647F;font-size:clamp(15px,1.15vw,18px);line-height:1.8;max-width:760px;margin:0}
.micro-label{font:600 11px/1.3 'JetBrains Mono',monospace;color:#2363DD;letter-spacing:.17em}

/* Why us: editorial 3-column layout with authored CSS dashboard artwork */
.why-section{padding:clamp(54px,6vw,102px) clamp(22px,4vw,92px) clamp(65px,5vw,90px);background:transparent}
.why-section .expanded-head{max-width:820px}
.why-layout{display:grid;grid-template-columns:minmax(225px,1fr) minmax(365px,1.65fr) minmax(225px,1fr);align-items:stretch;gap:clamp(16px,2vw,30px)}
.why-stack{display:grid;grid-template-rows:repeat(3,minmax(152px,1fr));gap:20px}
.why-card{border:1px solid rgba(255,255,255,.98);background:rgba(248,251,255,.64);border-radius:22px;padding:clamp(18px,1.5vw,28px);box-shadow:0 14px 45px #2B4C8E12;position:relative;transition:transform .3s,border-color .3s,box-shadow .3s;min-height:166px;overflow:hidden}
.why-card:hover{transform:translateY(-5px);border-color:#A7C3FA;box-shadow:0 22px 44px #2B4C8E22}
.why-card-num{font:700 10px/1.2 'JetBrains Mono',monospace;letter-spacing:.1em;color:#6B8FCC}
.why-card-icon{position:absolute;top:20px;right:22px;display:grid;place-items:center;width:34px;height:34px;background:#E1EEFF;border-radius:12px;color:#2474E8;box-shadow:0 8px 16px #4189FF1C}
.why-card h3{font:600 clamp(15px,1.1vw,19px)/1.35 'Onest',sans-serif;color:#0C1A36;margin:25px 0 8px}
.why-card p{font-size:clamp(12px,.93vw,14.5px);line-height:1.55;color:#52647A;margin:0}
.why-illustration{position:relative;min-height:100%;display:flex;flex-direction:column;justify-content:center;isolation:isolate}
.diagram-glow{position:absolute;inset:8% -5%;z-index:-2;filter:blur(40px);border-radius:55%;background:radial-gradient(ellipse,rgba(46,116,251,.12),transparent 65%)}
.diagram-header{font:700 11px/1.4 'JetBrains Mono',monospace;color:#2462B4;letter-spacing:.1em;display:flex;align-items:center;justify-content:center;gap:9px;margin:0 0 20px;text-align:center}
.diagram-live-dot{width:8px;height:8px;background:#13C6CA;display:inline-block;border-radius:50%;box-shadow:0 0 0 5px rgba(19,198,202,.1);animation:v6pulse 3s infinite}
.diagram-screen{position:relative;background:linear-gradient(145deg,#132C63,#071B44);border:1px solid rgba(83,159,255,.55);box-shadow:0 30px 55px -25px #17449575,inset 0 1px #A2C7FF3F;aspect-ratio:1.25/1;border-radius:30px;overflow:hidden;transform:perspective(1000px) rotateX(7deg) rotateY(-5deg);transition:transform .5s}
.why-illustration:hover .diagram-screen{transform:perspective(1000px) rotateX(0deg) rotateY(0deg) translateY(-5px)}
.diagram-screen:before{content:'';position:absolute;inset:0;opacity:.45;pointer-events:none;background:radial-gradient(ellipse at center,#167FD13F,transparent 58%),linear-gradient(90deg,#A3D4FF09 1px,transparent 1px),linear-gradient(#A3D4FF09 1px,transparent 1px);background-size:auto,35px 35px,35px 35px}
.diagram-nav{height:39px;display:flex;align-items:center;gap:6px;border-bottom:1px solid #4A75B44F;padding:0 18px;position:relative}
.diagram-nav i{width:7px;height:7px;border-radius:50%;background:#4674BE}
.diagram-nav i:first-child{background:#39C8F2}
.diagram-nav span{margin-left:auto;font:600 10px 'JetBrains Mono',monospace;letter-spacing:.1em;color:#86B0EA}
.diagram-stage{position:relative;height:calc(100% - 39px);display:grid;place-items:center}
.diagram-core{position:absolute;z-index:5;width:124px;height:124px;border-radius:31px;background:linear-gradient(130deg,#2B67EC,#15A8D6);display:grid;place-items:center;box-shadow:0 0 0 12px #3A84FF15,0 0 0 35px #3A84FF0D,0 25px 40px #020E30A0;animation:v6float 6s ease-in-out infinite}
.diagram-core svg{filter:drop-shadow(0 4px 10px #061A5366)}
.diagram-chip{position:absolute;z-index:6;background:#EFF6FF;border:1px solid #AECDFB;border-radius:13px;box-shadow:0 16px 32px #040F2688;color:#123B79;font:650 clamp(11px,1vw,14px)/1.3 'Onest',sans-serif;padding:12px 18px;white-space:nowrap}
.chip-a{top:18%;left:6%}.chip-b{top:12%;right:7%}.chip-c{bottom:15%;left:7%}.chip-d{bottom:16%;right:6%}
.diagram-connector{position:absolute;border:1.5px dashed #4ED9FB;opacity:.5;width:30%;height:24%;border-radius:25px}
.diagram-connector.c1{top:20%;left:23%;border-right:0;border-bottom:0}
.diagram-connector.c2{top:20%;right:23%;border-left:0;border-bottom:0}
.diagram-connector.c3{bottom:17%;left:35%;border-top:0}
.diagram-bottom{display:flex;align-items:center;gap:12px;justify-content:space-between;color:#637FA4;font:600 10px/1.5 'JetBrains Mono',monospace;letter-spacing:.05em;padding:20px 6px 0}
.diagram-bottom span:first-child{color:#167E9A}

/* Workflow cards */
.scenario-section{background:#F8FAFE;border:1px solid #D8E3F2;border-radius:38px;padding:clamp(40px,5vw,80px) clamp(24px,4.2vw,88px);box-shadow:0 25px 70px #2039600A}
.scene-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.scene-card{border:1px solid #DAE5F3;min-width:0;border-radius:24px;padding:clamp(18px,1.8vw,30px);background:linear-gradient(160deg,#fff,#F2F7FD);transition:transform .3s,box-shadow .3s}
.scene-card:hover{transform:translateY(-6px);box-shadow:0 24px 35px #143A791B}
.scene-top{display:flex;justify-content:space-between;align-items:center;color:#286BDC;font:700 11px/1.3 'JetBrains Mono',monospace;letter-spacing:.1em}
.scene-arrow{font:400 25px 'Onest',sans-serif}
.scene-card h3{font:600 clamp(17px,1.35vw,23px)/1.3 'Onest',sans-serif;color:#0C2143;margin:38px 0 12px}
.scene-card p{color:#52657F;line-height:1.7;font-size:14px;min-height:98px;margin:0 0 22px}
.scene-flow{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:12px;color:#10559D}
.scene-flow>span:first-child,.scene-flow>span:last-child{border-radius:11px;padding:9px;background:#E5F0FF;font-weight:700}
.scene-flow .flow-dots{color:#2E76E9;white-space:nowrap}

/* Technology selection */
.stack-section{margin:clamp(42px,5vw,85px) 0 0;padding:clamp(42px,5vw,78px) clamp(24px,4.4vw,88px);background:linear-gradient(124deg,#08162E,#0E2C59 70%,#123E80);border-radius:38px;display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:clamp(28px,5vw,110px);overflow:hidden}
.stack-section .micro-label{color:#4FD9F1}
.stack-intro h2{color:#F3F9FF}
.stack-intro>p{color:#AEBFD9}
.stack-glass{background:#FFFFFF0D;border:1px solid #8FAFF04F;border-radius:23px;padding:18px 26px;box-shadow:inset 0 1px #FFFFFF13}
.stack-row{display:grid;grid-template-columns:115px 1fr;gap:18px;align-items:center;padding:17px 5px;border-bottom:1px solid #B2D7FF22}
.stack-row:last-child{border:0}
.stack-name{font:600 12px 'JetBrains Mono',monospace;color:#73DAF7}
.stack-chips{font:550 clamp(12px,1.1vw,17px)/1.55 'Onest',sans-serif;color:#EAF3FF}

/* Careers and collaboration */
.careers-section{display:grid;grid-template-columns:minmax(300px,.85fr) 1.15fr;gap:clamp(28px,5vw,88px);padding:clamp(65px,6vw,100px) clamp(24px,4.4vw,90px);align-items:center}
.careers-intro>p{max-width:570px}
.careers-intro small{display:block;max-width:545px;color:#73839A;line-height:1.6;margin-top:16px;font-size:12px}
.careers-button{display:inline-flex;align-items:center;gap:30px;margin-top:28px;background:#1E67EA;color:#fff;padding:16px 22px;border-radius:14px;font-size:14px;font-weight:650;box-shadow:0 12px 26px #2167E94A;transition:transform .2s}
.careers-button:hover{transform:translateY(-3px)}
.careers-button span{font-size:19px}
.career-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.career-role{min-height:192px;border-radius:24px;border:1px solid #FFFFFF;background:#F6F9FEA6;box-shadow:0 13px 32px #1A39770C;padding:28px;transition:transform .3s}
.career-role:hover{transform:translateY(-5px)}
.career-role span{display:grid;place-items:center;border-radius:12px;width:36px;height:36px;background:#DEEAFC;color:#2571E8;font-size:20px}
.career-role h3{font-size:19px;line-height:1.3;color:#0E2549;font-weight:650;margin:19px 0 7px}
.career-role p{color:#596D88;font-size:14px;line-height:1.6;margin:0}

/* Evergreen insights / articles */
.insights-section{border-radius:38px;background:#EBF2FC;padding:clamp(45px,5vw,82px) clamp(24px,4.4vw,90px)}
.insights-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.insight-card{border:1px solid white;border-radius:23px;background:#F9FBFF;min-height:275px;padding:clamp(24px,2vw,38px);box-shadow:0 20px 35px #2A4D8010;transition:transform .3s}
.insight-card:hover{transform:translateY(-5px)}
.insight-no{font:600 11px 'JetBrains Mono',monospace;color:#2968D4;letter-spacing:.12em}
.insight-card h3{font-size:clamp(18px,1.6vw,25px);color:#102343;margin:33px 0 13px;line-height:1.3;font-weight:650}
.insight-card>p{color:#566A86;font-size:14.5px;line-height:1.7;min-height:72px}
.insight-card details summary{cursor:pointer;color:#1964DB;font-size:13px;font-weight:700;list-style:none;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #DDE8F6;padding-top:20px;margin-top:22px}
.insight-card details summary::-webkit-details-marker{display:none}
.insight-card details summary span{font-size:21px}
.insight-expanded{color:#405777;line-height:1.75;font-size:14px;margin-top:16px;animation:v6open .3s ease-out}

/* FAQs and CTA */
.faq-section{display:grid;grid-template-columns:.72fr 1.28fr;gap:65px;align-items:start;padding:clamp(60px,5vw,96px) clamp(24px,4.4vw,90px)}
.faq-heading{position:sticky;top:30px}
.faq-entries{border-top:1px solid #C7D5E8}
.faq-item{border-bottom:1px solid #C7D5E8;padding:6px 0}
.faq-item summary{color:#142744;list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:30px;font-size:clamp(15px,1.35vw,21px);font-weight:600;padding:24px 4px}
.faq-item summary::-webkit-details-marker{display:none}
.faq-plus{border:1px solid #BED0E8;color:#2B6EDE;display:grid;place-items:center;flex:none;width:35px;height:35px;border-radius:50%;font-size:25px;font-weight:400;transition:transform .3s,background .3s}
.faq-item[open] .faq-plus{transform:rotate(45deg);background:#E5F0FF}
.faq-item p{max-width:670px;color:#566D89;line-height:1.8;font-size:15px;margin:0 0 20px 4px;animation:v6open .3s ease-out}
.bridge-cta{background:linear-gradient(108deg,#1446BA,#256DF6 63%,#168FDC);color:#fff;border-radius:35px;padding:clamp(35px,4vw,72px) clamp(24px,4.4vw,90px);display:flex;align-items:center;justify-content:space-between;gap:30px;overflow:hidden}
.bridge-cta h2{font-family:'Unbounded','Onest',sans-serif;font-size:clamp(22px,2.5vw,38px);font-weight:500;line-height:1.3;margin:0 0 13px}
.bridge-cta p{font-size:15px;line-height:1.6;color:#D6EBFF;margin:0}
.bridge-cta>a{flex:none;background:#fff;color:#1445A8;border-radius:50px;display:flex;align-items:center;gap:30px;padding:18px 24px;font-size:14px;font-weight:700;transition:transform .2s}
.bridge-cta>a:hover{transform:translateY(-3px)}

/* Ease, keyboard access and motion preferences */
.fade-ready{opacity:0;transform:translateY(17px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.2,1)}
.fade-ready.entered{opacity:1;transform:none}
@keyframes v6pulse{50%{box-shadow:0 0 0 11px rgba(19,198,202,0)}}
@keyframes v6float{50%{transform:translateY(-9px)}}
@keyframes v6open{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}

@media(max-width:1250px){
 .redesign-v5 .design-reference .nav-links,.redesign-v5 .design-reference .cta-desktop{display:none!important}
 .redesign-v5 .design-reference .burger{display:flex!important}
 .why-layout{grid-template-columns:1fr 1.2fr}
 .why-stack:first-child{order:1}.why-stack:last-child{order:2}
 .why-illustration{grid-column:1 / -1;grid-row:1;max-width:740px;justify-self:center;width:100%;margin:15px 0 32px}
 .why-stack{grid-template-rows:repeat(3,minmax(145px,1fr))}
 .scene-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .scene-card p{min-height:50px}
}
@media(max-width:850px){
 .stack-section,.careers-section,.faq-section{grid-template-columns:1fr;gap:30px}
 .stack-section{border-radius:25px}.faq-heading{position:relative;top:0}
 .why-layout{grid-template-columns:1fr 1fr}
 .why-illustration{grid-column:1/-1}
 .why-stack{display:contents}
 .why-card{min-height:170px}
 .insights-grid{grid-template-columns:1fr 1fr}
 .insight-card:last-child{grid-column:1/-1}
 .bridge-cta{flex-direction:column;align-items:flex-start}
}
@media(max-width:600px){
 body.redesign-v5{padding:0 0 15px;background:#E9F0FC}
 .redesign-v5 .design-reference .design-inner{gap:20px}
 .redesign-v5 .design-reference .design-inner>div:first-child{border-radius:0 0 24px 24px!important}
 .redesign-v5 .design-reference header{padding:12px 14px 0!important}
 .redesign-v5 .design-reference #top{padding:30px 19px 40px!important;min-height:auto}
 .redesign-v5 .section{padding-left:17px;padding-right:17px}
 .redesign-v5 .portfolio-section{border-radius:24px;padding:28px 17px!important}
 .redesign-v5 .about-panel,.redesign-v5 .contact-shell{border-radius:24px}
 .redesign-v5 .footer{border-radius:20px;padding:26px 18px;margin-top:20px}
 .expanded-head{margin-bottom:26px}
 .why-section,.scenario-section,.stack-section,.careers-section,.insights-section,.faq-section,.bridge-cta{padding:45px 18px}
 .why-section{padding-top:54px}
 .why-layout{display:flex;flex-direction:column;gap:12px}
 .why-stack{display:grid;grid-template-columns:1fr;grid-template-rows:auto;gap:12px}
 .why-stack:first-child{order:2}.why-stack:last-child{order:3}
 .why-illustration{order:1;max-width:100%;margin:2px 0 22px}
 .why-card{min-height:auto;padding:20px}
 .why-card h3{margin:12px 0 8px}
 .why-card p{font-size:13.5px}
 .diagram-screen{aspect-ratio:1.08/1;transform:none}
 .diagram-chip{font-size:10px;padding:8px}
 .diagram-core{width:94px;height:94px;border-radius:22px}
 .diagram-core svg{width:65px;height:65px}
 .diagram-bottom{flex-wrap:wrap;gap:3px;font-size:9px}
 .scene-grid,.career-grid,.insights-grid{grid-template-columns:1fr;gap:13px}
 .insight-card:last-child{grid-column:auto}
 .scene-card{min-height:auto}
 .scene-card h3{margin-top:26px}
 .scene-card p{min-height:0}
 .career-role{min-height:150px}
 .insight-card{min-height:auto}
 .insight-card>p{min-height:0}
 .stack-row{grid-template-columns:90px 1fr;gap:14px}
 .stack-glass{padding:12px 14px}
 .bridge-cta>a{width:100%;justify-content:space-between}
 .faq-item summary{font-size:16px}
 .redesign-v5.portfolio-detail-body .portfolio-detail{padding:28px 17px}
}
@media(prefers-reduced-motion:reduce){
 .fade-ready{opacity:1!important;transform:none!important;transition:none!important}
 .diagram-core,.diagram-live-dot{animation:none!important}
 .why-card,.scene-card,.insight-card,.career-role{transition:none!important}
}
/* Accessibility/security honeypot stays hidden without creating a 100000px RTL overflow. */
body.redesign-v5 #project-form .form-honeypot{position:absolute!important;left:0!important;right:auto!important;top:0!important;width:1px!important;height:1px!important;clip-path:inset(50%)!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}
