/* KLC Teknoloji — colourful corporate theme, scoped to the public homepage. */
.reference-site{--ink:#193c7c;--muted:#577296;--gold:#ff931b;--gold2:#ffbc35;--gold-dark:#ce610e;--cream:#eff9ff;--paper:#fff;--line:#d6e9f7;background:#eaf6ff;color:var(--ink);font-family:"Segoe UI",Arial,sans-serif}.reference-site .wrap{width:min(1320px,calc(100% - 56px))}.reference-site h1,.reference-site h2,.reference-site h3{font-family:"Segoe UI",Arial,sans-serif}.reference-site .site-header{background:linear-gradient(#f6fcff 0 26px,transparent 26px),linear-gradient(90deg,#2054a9 0%,#49ab70 26%,#baca22 45%,#ff991e 69%,#cf4eae 100%);border-bottom:4px solid #244ea4;box-shadow:0 5px 0 #123f8120,0 9px 18px #113c8820;backdrop-filter:none;z-index:80}.reference-site .nav{min-height:109px;gap:18px;padding-top:16px;align-items:center}.reference-site .nav>.brand{position:relative;align-self:flex-start;z-index:2;background:linear-gradient(#fff,#f5f8ff 70%,#e4e9f2);border:1px solid #fff;border-radius:0 0 29px 29px;box-shadow:0 6px 4px #24416f44;padding:18px 19px 23px;min-height:104px;margin-top:-16px;margin-bottom:-20px;gap:12px}.reference-site .brand-icon{width:43px;height:46px;border:1px solid #d2b163;border-radius:11px;background:linear-gradient(130deg,#ffe8a5,#ffc657);font:700 31px Georgia,serif;color:#83541b}.reference-site .brand strong{font:800 23px/1.1 "Segoe UI",Arial,sans-serif;letter-spacing:.2px;color:#214185}.reference-site .brand small{font-size:8px;letter-spacing:1.45px;color:#617496;line-height:1.6;max-width:260px}.reference-site .brand-image{max-width:235px;max-height:61px}.reference-site .nav nav{gap:19px;margin-left:auto;padding-top:10px}.reference-site .nav nav a{color:white;font-size:11px;font-weight:750;text-shadow:0 1px 2px #6f5b3150}.reference-site .nav nav a:hover,.reference-site .nav nav a.active{color:#fff6ac;text-shadow:0 1px 3px #49420a80}.reference-site .nav-contact{padding:12px 16px;color:white;border:1px solid #ffd15c;border-radius:25px;background:linear-gradient(110deg,#ff7717,#ffb922);box-shadow:inset 0 0 7px #ffe584,0 4px 10px #75460022;font-size:11px;font-weight:750;margin-top:10px}.reference-site .nav .klc-chat-entry{padding:12px 16px;border:1px solid #82caff;color:#fff;background:linear-gradient(120deg,#1468d5,#19b8df);box-shadow:inset 0 0 7px #8bf2ff,0 4px 10px #10438f33}.reference-site .nav .klc-chat-mobile{display:none}.reference-site a:focus-visible,.reference-site button:focus-visible,.reference-site input:focus-visible,.reference-site textarea:focus-visible,.reference-site select:focus-visible,.reference-site summary:focus-visible{outline:3px solid #ffb332;outline-offset:4px}
.reference-site .hero{min-height:585px;isolation:isolate;background:#247fd0 url('/assets/klc-color-landscape.svg?v=1') center/cover no-repeat;overflow:hidden;border:0}.reference-site .hero-inner{min-height:585px;align-items:center;gap:30px}.reference-site .hero-photo{left:auto;right:1%;top:50px;bottom:auto;width:50%;height:435px;object-fit:cover;object-position:center;border:7px solid #ffffffdb;border-radius:45px 9px 60px 9px;transform:rotate(-2deg);box-shadow:0 18px 40px #0a3b8a55;z-index:0;opacity:1;background:#fff}.reference-site .hero-shade{display:none}.reference-site .hero-copy{max-width:560px;width:46%;padding:50px 0 95px;z-index:1}.reference-site .hero .eyebrow{color:#e5ffbb;font-size:10px;letter-spacing:2.2px;text-shadow:0 1px 2px #14508b}.reference-site .hero h1{font-weight:750;font-size:clamp(46px,4.2vw,65px);line-height:1.09;letter-spacing:-2px;color:white;margin:20px 0;overflow-wrap:anywhere}.reference-site .hero h1 em{color:#ffda6b;font-style:normal;text-shadow:0 2px 0 #814b2c18}.reference-site .hero-lead{font-size:14px;color:#e7f5ff;line-height:1.85;max-width:490px}.reference-site .hero-actions{gap:11px;margin-top:27px}.reference-site .button{border-radius:26px;font-size:12px;font-weight:750;padding:14px 20px;min-height:46px;letter-spacing:0;gap:18px}.reference-site .button.gold,.reference-site .button-gold{background:linear-gradient(110deg,#ff7b1c,#ffb825);border:1px solid #ffd25a;box-shadow:inset 0 0 7px #ffe07c,0 6px 12px #0f418e22;color:white}.reference-site .button.outline,.reference-site .button-outline{background:#ffffff15;color:#fff;border:1px solid #ffffffa0;box-shadow:inset 0 0 12px #ffffff12}.reference-site .hero-badge{display:flex;position:absolute;right:28px;bottom:84px;max-width:315px;background:linear-gradient(135deg,#fff,#e9f3ff);border:2px solid #fff;border-radius:18px 5px 18px 5px;padding:15px 19px;box-shadow:0 10px 22px #184b9935;align-self:auto;margin:0;color:#244486}.reference-site .badge-k{color:#ed8a1c}.reference-site .hero-badge>span:last-child{font-size:13px;letter-spacing:.5px}.reference-site .hero-badge small{font-family:"Segoe UI",Arial,sans-serif;font-style:normal;font-size:10px;color:#58749c;letter-spacing:0}
.reference-site .features{margin-top:-43px;gap:12px;position:relative;z-index:3}.reference-site .features article{position:relative;min-height:112px;border:2px solid #fff;border-radius:20px 6px 20px 6px;background:linear-gradient(145deg,#fff,#e8f6ff);box-shadow:0 12px 23px #1a5b9b1c;overflow:hidden;padding:12px 7px;color:#244584}.reference-site .features article:before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:#328de2}.reference-site .features article:nth-child(2):before{background:#85ba2f}.reference-site .features article:nth-child(3):before{background:#ff9d24}.reference-site .features article:nth-child(4):before{background:#cc5ac7}.reference-site .features article:nth-child(5):before{background:#7765d9}.reference-site .features article:nth-child(6):before{background:#18b8cf}.reference-site .features .icon{color:#2e8acb;width:27px;height:27px}.reference-site .features article:nth-child(2) .icon{color:#76a826}.reference-site .features article:nth-child(3) .icon{color:#ed8d13}.reference-site .features article:nth-child(4) .icon{color:#bc54b9}.reference-site .features article:nth-child(5) .icon{color:#7863cf}.reference-site .features article:nth-child(6) .icon{color:#18a9bf}.reference-site .features b{font-size:10px;font-weight:750;letter-spacing:.45px;line-height:1.5}.reference-site .section{padding-top:75px;padding-bottom:70px}.reference-site .section-head{margin-bottom:30px}.reference-site .eyebrow{color:#2386c9;font-size:10px;letter-spacing:2.5px;font-weight:750}.reference-site .section-head h2,.reference-site .statement h2,.reference-site .approach h2,.reference-site .contact-section h2{font-size:clamp(29px,3.2vw,44px);font-weight:750;letter-spacing:-1.3px;line-height:1.17;color:#234584}.reference-site .section-head>p{color:#5a779d;font-size:13px;line-height:1.9}.reference-site .product-grid{gap:20px}.reference-site .product-card,.reference-site .product-card.tv,.reference-site .product-card.network{height:335px;border:3px solid #fff;border-radius:28px 8px 28px 8px;background:linear-gradient(135deg,#2058ac,#29a3db);box-shadow:0 10px 22px #19518b25;overflow:hidden}.reference-site .product-card.tv{background:linear-gradient(130deg,#8dbb31,#59a94b)}.reference-site .product-card.network{background:linear-gradient(135deg,#8f66cb,#536bd0)}.reference-site .product-text{padding:27px;max-width:73%}.reference-site .product-text .mini{color:#fff0a7;letter-spacing:1.25px;font-size:9px}.reference-site .product-text h3{font:750 27px/1.16 "Segoe UI",Arial,sans-serif;color:#fff;letter-spacing:-.8px}.reference-site .product-text>p:not(.mini){color:#effaff;line-height:1.8;font-size:12px;max-width:235px}.reference-site .product-text button,.reference-site .product-text a{background:linear-gradient(#ff8c1e,#ffbd24);border:1px solid #ffd55c;box-shadow:inset 0 0 7px #ffe7a2;color:#fff;padding:10px 15px;border-radius:23px;font-weight:750;font-size:11px}.reference-site .illustration{filter:drop-shadow(0 10px 10px #18438440)}.reference-site .racks{right:0}.reference-site .dashboard{right:-28px}.reference-site .tvscreen{right:-25px}
.reference-site .statement{position:relative;background:linear-gradient(125deg,#8bbb35,#69ac50);border-top:5px solid #fff;border-bottom:5px solid #fff;padding:70px 0;color:white}.reference-site .statement-grid{gap:65px}.reference-site .statement-art{border:6px solid #ffffffdc;border-radius:40px 8px 40px 8px;background:radial-gradient(circle at 70% 20%,#b6d6ff,#48aade 45%,#395ec1);box-shadow:0 15px 30px #305b3333;height:335px}.reference-site .art-logo{color:#fff8;font-family:Georgia,serif}.reference-site .statement-art p{color:white;font-size:19px;font-weight:600;max-width:310px;line-height:1.5}.reference-site .statement .eyebrow{color:#f8ffd1}.reference-site .statement h2{color:#fff}.reference-site .statement-copy>p:not(.eyebrow){color:#f3ffe8;font-size:14px;line-height:1.9;margin-top:18px}.reference-site .statement .text-link{color:#fff7ba;font-weight:750;font-size:12px}.reference-site .solution-grid{gap:18px}.reference-site .solution-grid details{background:linear-gradient(135deg,#fff,#eef7ff);border:2px solid #fff;border-radius:24px 7px 24px 7px;box-shadow:0 8px 20px #245b8d16;overflow:hidden}.reference-site .solution-grid details:nth-child(4n+1){border-top:5px solid #2c8fd9}.reference-site .solution-grid details:nth-child(4n+2){border-top:5px solid #8abd33}.reference-site .solution-grid details:nth-child(4n+3){border-top:5px solid #ffac28}.reference-site .solution-grid details:nth-child(4n+4){border-top:5px solid #bd61c6}.reference-site .solution-grid summary{padding:25px}.reference-site .solution-grid summary>span{color:#2a8cd0;font:700 28px "Segoe UI",Arial,sans-serif;opacity:.7}.reference-site .solution-grid summary h3{font:750 21px/1.3 "Segoe UI",Arial,sans-serif;color:#244987;margin:16px 0 12px;min-height:54px}.reference-site .solution-grid summary p{font-size:12px;color:#5d799d;line-height:1.9;min-height:90px}.reference-site .solution-more{font-size:11px;color:#df7b16}.reference-site .solution-expanded{border-top:1px solid #cfdfef;padding:0 25px 20px}.reference-site .solution-expanded p{font-size:12px;color:#506b94}.reference-site .approach{background:linear-gradient(120deg,#edf8ff,#f7efff);padding:65px 0}.reference-site .approach-grid{gap:60px;align-items:center}.reference-site .approach p:not(.eyebrow){color:#58759c;font-size:14px;line-height:1.9}.reference-site .approach-list div{background:#ffffffda;border:2px solid #fff;border-radius:14px 4px 14px 4px;padding:16px 18px;margin:10px 0;font-size:13px;font-weight:600;color:#3c6092;box-shadow:0 5px 13px #41689a0d}.reference-site .approach-list .icon{color:#84b333;flex-shrink:0}
.reference-site .contact-section{padding:75px 0;background:linear-gradient(125deg,#235cb3,#336bc2 45%,#7150b9);color:#fff;border-top:5px solid #fff}.reference-site .contact-grid{gap:65px}.reference-site .contact-section .eyebrow{color:#ffdda0}.reference-site .contact-section h2{color:white}.reference-site .contact-intro>p{color:#e0eeff;font-size:14px;line-height:1.9}.reference-site .contact-links a,.reference-site .contact-links p{color:#edf5ff;font-size:13px}.reference-site .contact-links .icon{color:#ffcd55}.reference-site .existing-customer{color:#d9e9ff;background:#ffffff0f;border:1px solid #ffffff35;border-radius:14px;padding:18px;font-size:12px}.reference-site .existing-customer a{color:#ffe292;font-weight:700;margin-top:7px}.reference-site .contact-form{background:linear-gradient(135deg,#fff,#f2f8ff);border:3px solid #fff;border-radius:28px 8px 28px 8px;box-shadow:0 18px 30px #153a7733;padding:30px;color:#375e8f}.reference-site .contact-form label{color:#3b5f8d;font-size:11px;font-weight:650}.reference-site .contact-form input,.reference-site .contact-form textarea,.reference-site .contact-form select{color:#294a7d;border:1px solid #cfdfef;border-radius:9px;background:#fff;font-size:14px;padding:12px}.reference-site .contact-form input::placeholder,.reference-site .contact-form textarea::placeholder{color:#8094b0;opacity:1}.reference-site .contact-form .form-note{color:#7186a3;font-size:10px!important;line-height:1.8}.reference-site .optional{color:#7890b0}.reference-site .contact-alternative{background:#ffffff14;border:1px solid #ffffff55;border-radius:25px;padding:30px;color:#fff}.reference-site footer{background:#193f89;border-top:5px solid transparent;border-image:linear-gradient(90deg,#26b8e4,#92bc31,#ffaf20,#d65bc3) 1;padding:27px 0;color:#d5e8ff}.reference-site footer strong{color:#fff;font-size:17px}.reference-site footer small{color:#bbd6fc;letter-spacing:1.3px;font-size:8px}.reference-site footer p,.reference-site footer a{color:#d0e5ff;font-size:10px}.reference-site .product-dialog{background:linear-gradient(135deg,#fff,#edf7ff);border:3px solid #ffb633;border-radius:25px 7px 25px 7px;color:#294e87}.reference-site .product-dialog h2{font-weight:750;font-size:31px}.reference-site .product-dialog .eyebrow{color:#188ac5}.reference-site .product-dialog>p:not(.eyebrow){color:#5b7498}.reference-site .product-dialog .dialog-subtitle{color:#d77819!important}.reference-site .product-dialog li{font-size:12px;color:#42618f}.reference-site .product-dialog li .icon{color:#83b336}.reference-site .dialog-close{background:#ffad28;border:1px solid #ffd278;color:white}.reference-site .notice.success{background:#edf9ee;color:#226e39;border:1px solid #9bce9d}.reference-site .notice.error{background:#fff0ed;color:#a33324;border:1px solid #e5b2a7}
@media(max-width:1350px){.reference-site .nav .nav-contact{display:none}.reference-site .nav{min-height:100px}.reference-site .nav>.brand{min-height:100px}.reference-site .nav .menu-toggle{display:block;margin-left:auto;margin-top:12px;border:1px solid #fff9;border-radius:10px;background:linear-gradient(#fff,#e6f2ff);padding:8px 13px;color:#2654a0;font-size:23px;box-shadow:0 3px 5px #17407e25}.reference-site .nav nav{display:none;position:absolute;left:0;right:0;top:100%;margin:0;padding:18px 24px;background:linear-gradient(135deg,#fff,#eef8ff);box-shadow:0 13px 20px #1842892b;flex-direction:column;align-items:stretch;gap:0;max-height:calc(100dvh - 110px);overflow:auto}.reference-site .nav nav.open{display:flex}.reference-site .nav nav a{color:#2d5590;text-shadow:none;padding:12px 8px;font-size:13px;border-bottom:1px solid #d7e7f6;min-height:44px}.reference-site .nav nav a.active,.reference-site .nav nav a:hover{color:#d97813;text-shadow:none}.reference-site .nav nav a.mobile-platform,.reference-site .nav nav a.klc-chat-mobile{display:block;font-weight:750;color:#df7b16}.reference-site .hero-copy{width:48%;padding-bottom:80px}.reference-site .hero h1{font-size:51px}.reference-site .hero-badge{right:18px;bottom:75px}.reference-site .hero-photo{width:49%;height:420px}.reference-site .features{gap:8px}.reference-site .features b{font-size:9px}}
@media(max-width:1000px){.reference-site .hero{min-height:555px}.reference-site .hero-inner{min-height:555px}.reference-site .hero h1{font-size:45px}.reference-site .hero-copy{width:51%;padding:45px 0 95px}.reference-site .hero-photo{right:-8%;width:55%;top:72px;height:340px;border-width:5px}.reference-site .hero-lead{font-size:13px}.reference-site .hero-actions{flex-direction:column;align-items:flex-start;gap:9px}.reference-site .hero-actions .button{min-width:230px}.reference-site .hero-badge{bottom:65px;right:15px;max-width:245px;padding:12px}.reference-site .hero-badge small{font-size:8px}.reference-site .hero-badge>span:last-child{font-size:11px}.reference-site .features{grid-template-columns:repeat(3,1fr)}.reference-site .features article{min-height:100px}.reference-site .product-grid{grid-template-columns:1fr}.reference-site .product-card,.reference-site .product-card.tv,.reference-site .product-card.network{height:280px}.reference-site .product-text{max-width:60%;padding:25px}.reference-site .product-text h3{font-size:27px}.reference-site .illustration{opacity:1;right:0}.reference-site .dashboard{right:20px;bottom:40px;width:280px;height:180px}.reference-site .tvscreen{right:15px;bottom:55px;width:270px;height:160px}.reference-site .racks{right:30px;bottom:0}.reference-site .statement-grid{gap:35px}.reference-site .statement-art{height:310px}.reference-site .solution-grid{grid-template-columns:repeat(2,1fr)}.reference-site .contact-grid{gap:30px}.reference-site .contact-form{padding:23px}.reference-site .section{padding-top:60px;padding-bottom:55px}}
@media(max-width:760px){.reference-site .wrap,.reference-site .contact-grid{width:calc(100% - 32px)}.reference-site .nav{min-height:90px;padding-top:12px}.reference-site .nav>.brand{margin-top:-12px;min-height:94px;padding:17px 13px 20px;gap:9px;border-radius:0 0 22px 22px;margin-bottom:-15px}.reference-site .brand-icon{width:33px;height:38px;font-size:25px;border-radius:9px}.reference-site .brand strong{font-size:17px}.reference-site .brand small{font-size:6px;letter-spacing:.9px;max-width:210px}.reference-site .brand-image{max-width:205px;max-height:55px}.reference-site .nav .menu-toggle{margin-top:10px;font-size:21px;padding:7px 11px}.reference-site .site-header{border-bottom-width:3px;background:linear-gradient(#f6fcff 0 19px,transparent 19px),linear-gradient(90deg,#2c60b5,#78b93a 35%,#ffb027 70%,#cc56bd)}.reference-site .nav nav{max-height:calc(100dvh - 95px)}.reference-site .hero{min-height:755px}.reference-site .hero-inner{min-height:755px;align-items:flex-start;display:block}.reference-site .hero-copy{width:100%;max-width:540px;padding:49px 0 0}.reference-site .hero .eyebrow{font-size:8px;letter-spacing:1.6px}.reference-site .hero h1{font-size:43px;line-height:1.08;letter-spacing:-1.5px;max-width:460px;margin:17px 0}.reference-site .hero-lead{font-size:12px;max-width:450px;line-height:1.8}.reference-site .hero-actions{flex-direction:row;align-items:stretch;margin-top:22px;gap:9px}.reference-site .hero-actions .button{min-width:0;padding:13px 15px;font-size:10px;gap:13px}.reference-site .hero-photo{width:87%;right:5%;top:420px;height:235px;border:5px solid white;border-radius:26px 5px 38px 5px;object-position:center;transform:rotate(-3deg)}.reference-site .hero-badge{right:16px;bottom:60px;max-width:240px;padding:10px 13px;border-radius:14px 4px}.reference-site .hero-badge>span:last-child{font-size:10px}.reference-site .hero-badge .badge-k{font-size:29px}.reference-site .features{margin-top:-26px;gap:8px;grid-template-columns:repeat(3,1fr)}.reference-site .features article{min-height:99px;border-radius:16px 5px;padding:12px 4px;gap:7px}.reference-site .features .icon{width:24px;height:24px}.reference-site .features b{font-size:8px;letter-spacing:.1px;line-height:1.5}.reference-site .section{padding-top:51px;padding-bottom:45px}.reference-site .section-head{display:block;margin-bottom:25px}.reference-site .section-head h2,.reference-site .statement h2,.reference-site .approach h2,.reference-site .contact-section h2{font-size:31px;letter-spacing:-1px}.reference-site .section-head>p{font-size:12px;line-height:1.8;max-width:450px}.reference-site .eyebrow{font-size:9px;letter-spacing:2px}.reference-site .product-grid{gap:16px}.reference-site .product-card,.reference-site .product-card.tv,.reference-site .product-card.network{height:315px;border-radius:24px 6px}.reference-site .product-text{padding:22px;max-width:76%}.reference-site .product-text h3{font-size:26px;max-width:240px}.reference-site .product-text>p:not(.mini){font-size:11px;max-width:210px}.reference-site .product-text button{font-size:10px;padding:9px 13px}.reference-site .illustration{opacity:.8}.reference-site .dashboard{width:205px;height:135px;right:-40px;bottom:17px;transform:rotate(-8deg)}.reference-site .tvscreen{width:205px;height:133px;right:-38px;bottom:31px}.reference-site .racks{right:-15px;bottom:-30px;opacity:.65}.reference-site .racks div{height:210px;width:40px}.reference-site .statement{padding:45px 0}.reference-site .statement-grid{display:grid;grid-template-columns:1fr;gap:29px}.reference-site .statement-art{height:255px;border-width:4px;border-radius:30px 6px;order:2}.reference-site .statement-art p{font-size:17px}.reference-site .statement-copy>p:not(.eyebrow){font-size:12px;line-height:1.85;margin-top:16px}.reference-site .solution-grid{grid-template-columns:1fr;gap:15px}.reference-site .solution-grid summary{padding:23px}.reference-site .solution-grid summary h3{font-size:21px;min-height:0;margin:12px 0}.reference-site .solution-grid summary p{min-height:0;font-size:12px}.reference-site .solution-expanded p{line-height:1.9}.reference-site .approach{padding:45px 0}.reference-site .approach-grid{grid-template-columns:1fr;gap:20px}.reference-site .approach p:not(.eyebrow){font-size:12px}.reference-site .approach-list div{font-size:12px;padding:14px;margin:8px 0}.reference-site .contact-section{padding:46px 0}.reference-site .contact-grid{display:grid;grid-template-columns:1fr;gap:25px}.reference-site .contact-intro>p{font-size:12px}.reference-site .contact-form{padding:21px 18px;border-radius:22px 6px}.reference-site .contact-form input,.reference-site .contact-form textarea,.reference-site .contact-form select{font-size:16px}.reference-site .contact-form .form-row{grid-template-columns:1fr}.reference-site .contact-form .button{margin-top:0;min-height:46px}.reference-site .footer-inner{display:flex;flex-direction:column;align-items:flex-start;gap:15px}.reference-site footer p{margin:0}.reference-site .product-dialog{padding:32px 23px;max-height:88dvh}.reference-site .product-dialog h2{font-size:27px}}
@media(max-width:350px){.reference-site .nav>.brand{padding-inline:10px;gap:7px}.reference-site .brand strong{font-size:15px}.reference-site .brand small{font-size:5.5px;letter-spacing:.55px}.reference-site .brand-icon{width:29px;height:34px;font-size:23px}.reference-site .nav .menu-toggle{padding:7px 9px;font-size:19px}.reference-site .hero h1{font-size:38px}.reference-site .hero-actions .button{font-size:9px;padding:12px 11px;gap:8px}.reference-site .hero .eyebrow{font-size:7px}.reference-site .features b{font-size:7px}}
@media(prefers-reduced-motion:reduce){.reference-site *{animation:none!important;transition:none!important}.reference-site{scroll-behavior:auto}}
/* On phones, artwork follows the text so long CMS headlines cannot overlap it. */
@media(max-width:760px){.reference-site .hero{display:flex;flex-direction:column;min-height:0}.reference-site .hero-inner{min-height:0;order:1}.reference-site .hero-copy{padding-bottom:0}.reference-site .hero-actions{display:flex;flex-wrap:wrap}.reference-site .hero-photo{position:relative;inset:auto;order:2;flex:none;width:87%;height:235px;margin:28px auto 75px}.reference-site .hero-badge{top:calc(100% + 195px);bottom:auto;z-index:2}}