/* Corbiq Login - modern MES temasi (acik zemin, kirmizi marka rengi) */
:root{
  --clg-ink:#15162a;
  --clg-muted:#55596f;
  --clg-red:#C1272D;
  --clg-line:#e8e8f1;
  --clg-green:#148d77;
}
.clg-body{margin:0;background:#f8f9fd;color:var(--clg-ink);font-family:'DM Sans',Arial,sans-serif;font-size:14px}
.clg-body *{box-sizing:border-box}
.clg-body button,.clg-body input{font:inherit}
.clg-body button,.clg-body a,.clg-body input{-webkit-tap-highlight-color:transparent}
.clg-body button,.clg-body a{touch-action:manipulation}
.clg-body button{cursor:pointer}
.clg-body button:disabled{cursor:wait}
.clg-body a{color:inherit;text-decoration:none}
.clg-body button:focus-visible,.clg-body a:focus-visible,.clg-body input:focus-visible{outline:3px solid #f09095;outline-offset:3px}
.clg-body svg{display:block}

.clg-page{height:100vh;max-width:1800px;margin:auto;padding:14px 4.2% 10px;position:relative;overflow:hidden;display:flex;flex-direction:column}
.clg-ambient{position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 32% 54%,#fde0e180,transparent 46%),radial-gradient(ellipse at 86% 16%,#fff0f090,transparent 38%)}

/* Header */
.clg-header{display:flex;align-items:center;justify-content:flex-end;flex:0 0 auto}
a.clg-whatsapp-cta{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 17px;border-radius:10px;background:#17182d;color:#fff;font-weight:650;letter-spacing:.1px;font-size:13px;box-shadow:0 7px 18px #17182d14;transition:transform .2s,box-shadow .2s,background .2s}
.clg-whatsapp-cta:hover{transform:translateY(-1px);background:#252741;box-shadow:0 10px 24px #17182d1d}

/* Layout - .clg-main viewport'ta kalan alani doldurur, tasma durumunda kaydirma yerine icerik kuculur (clamp ile) */
.clg-main{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(360px,1fr);gap:6%;align-items:start;padding:clamp(48px,8vh,88px) 0 clamp(4px,1.2vh,16px);overflow:hidden}
.clg-showcase{min-width:0;position:relative}

.clg-eyebrow{display:inline-flex;align-items:center;gap:8px;color:#7a2a2a;font-size:12px;font-weight:750;letter-spacing:1.8px}
.clg-eyebrow i{width:6px;height:6px;background:var(--clg-red);border-radius:50%;box-shadow:0 0 0 4px #fde8e9;display:inline-block}

.clg-h1{font-family:Manrope,sans-serif;letter-spacing:-2.6px;font-size:clamp(28px,3.4vw,56px);line-height:1.12;font-weight:800;margin:clamp(6px,1.4vh,12px) 0 clamp(6px,1vh,10px)}
.clg-h1 span{background:linear-gradient(100deg,#C1272D 0%,#d04248 45%,#a82830 90%);background-clip:text;-webkit-text-fill-color:transparent}

.clg-intro{color:#3f4257;line-height:1.6;font-size:clamp(12.5px,1.5vh,15px);font-weight:500;max-width:500px;margin:0}

/* Stage / illustration - yukseklik viewport yuksekligine gore oranli kuculur */
.clg-stage{height:clamp(150px,27vh,300px);position:relative;margin-top:clamp(2px,0.8vh,6px)}
.clg-factory{width:100%;height:100%;overflow:visible}
.clg-scene-base{filter:drop-shadow(0 22px 20px #6566b118)}

.clg-float-card{position:absolute;border:1px solid #fff;background:#ffffffed;border-radius:13px;box-shadow:0 12px 40px #4c439410;z-index:2;animation:clg-float 7s ease-in-out infinite;padding:14px 16px}
.clg-oee-card{left:1%;top:50px;width:156px}
.clg-mini-heading{font-size:12px;color:#22233a;font-weight:600;display:flex;justify-content:space-between;align-items:center;gap:12px}
.clg-mini-heading>span{color:#0f9d80;font-size:10px;font-weight:700}
.clg-oee-row{display:flex;align-items:center;gap:12px;margin-top:11px}
.clg-ring{background:conic-gradient(#C1272D 0 85.2%,#fde8e9 85.2% 100%);width:55px;height:55px;border-radius:50%;display:grid;place-items:center;position:relative}
.clg-ring:before{content:'';position:absolute;inset:5px;border-radius:50%;background:white}
.clg-ring b{z-index:1;font-size:13px}
.clg-mini-copy{font-size:11px;color:#3f4257;font-weight:500;line-height:1.8}
.clg-mini-copy strong{color:#0f6b4c;font-size:12px;font-weight:700}
.clg-count-card{right:0;top:17px;width:157px;animation-delay:-2s}
.clg-count{font-family:Manrope,sans-serif;font-size:25px;font-weight:800;margin-top:6px;letter-spacing:-1px}
.clg-spark{width:100%;height:32px;margin-top:6px}
.clg-sync-card{right:2%;bottom:33px;display:flex;gap:10px;align-items:center;animation-delay:-4s;padding:12px 14px}
.clg-sync-icon{width:30px;height:30px;border-radius:9px;background:#e7f8f0;color:#16a27c;display:grid;place-items:center}
.clg-sync-card strong{font-size:12px;color:#22233a;font-weight:700}
.clg-sync-card p{font-size:11px;color:#3f4257;font-weight:500;margin:3px 0 0}
.clg-stage-meta{position:absolute;bottom:3px;left:3px;right:3px;display:flex;align-items:center;justify-content:flex-start;color:#4a4d63;font-size:10.5px;font-weight:650;letter-spacing:.2px}
.clg-stage[data-mode="oee"] .clg-oee-card,
.clg-stage[data-mode="erp"] .clg-sync-card,
.clg-stage[data-mode="live"] .clg-count-card{border:1.5px solid #C1272D;box-shadow:0 10px 32px #C1272D45}

/* Feature tabs */
.clg-features{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:clamp(6px,1.2vh,12px)}
.clg-feature{text-align:left;position:relative;border:1px solid transparent;background:transparent;border-radius:11px;padding:13px 12px 15px;overflow:hidden;transition:background .3s,border-color .3s,transform .3s}
.clg-feature:hover{transform:translateY(-3px);background:#ffffffb0}
.clg-feature.active{background:#ffffffd9;border-color:#fde0e1;box-shadow:0 6px 17px #C1272D04}
.clg-feature:after{content:'';height:2px;position:absolute;left:12px;right:12px;bottom:0;background:#C1272D;transform:scaleX(0);transform-origin:left}
.clg-feature.active:after{transform:scaleX(1);transition:transform .5s}
.clg-feature-top{display:flex;gap:8px;align-items:center;font-size:12.5px;font-weight:750;color:#22233a}
.clg-feature-icon{color:var(--clg-red);width:17px;height:17px}
.clg-feature p{margin:8px 0 0;color:#4a4d63;font-size:12px;line-height:1.6}
.clg-feature-detail{font-size:13px;color:#3f4257;font-weight:500;min-height:18px;margin:12px 12px 0;line-height:1.6}

/* Login side */
.clg-login-side{width:100%;max-width:440px;justify-self:end}
.clg-login-brand{display:flex;align-items:center;margin:0 0 clamp(12px,2.2vh,24px)}
.clg-login-brand img{display:block;width:170px;height:auto}

.clg-login-card{background:#fff;border:1px solid #ededf4;border-radius:22px;padding:clamp(18px,3.2vh,32px) 35px clamp(14px,2.6vh,26px);box-shadow:0 20px 65px #33305a08,0 3px 6px #4c406004;position:relative}
.clg-login-card h2{font-family:Manrope,sans-serif;font-size:24px;letter-spacing:-.8px;font-weight:800;margin:0 0 9px}
.clg-subtitle{color:#55596f;font-size:13px;line-height:1.7;margin:0 0 clamp(14px,2.6vh,28px)}

.clg-field{margin-bottom:clamp(10px,1.8vh,19px)}
.clg-field label{display:block;font-weight:600;font-size:12px;color:#292a3d;margin-bottom:9px}
.clg-input-wrap{position:relative;display:flex;align-items:center}
.clg-input-wrap>svg{position:absolute;left:14px;color:#9695a8;width:16px;height:16px;pointer-events:none}
.clg-input-wrap input{width:100%;height:47px;border:1px solid #e3e3ec;border-radius:9px;padding:0 42px 0 41px;background:#fdfdff;color:var(--clg-ink);font-size:15px;transition:border-color .2s,box-shadow .2s}
.clg-input-wrap input::placeholder{color:#aaa9b8}
.clg-input-wrap input:focus{outline:none;border-color:#C1272D;box-shadow:0 0 0 3px #C1272D12;background:#fff}
.clg-reveal{position:absolute;right:5px;padding:9px;border:0;background:transparent;color:#9391a7;display:grid;place-items:center}
.clg-reveal svg{width:17px;height:17px}

.clg-err{display:none;color:#C1272D;font-size:11px;font-weight:600;line-height:1.5;margin-top:7px}
.clg-field.invalid .clg-err{display:block}
.clg-field.invalid .clg-input-wrap input{border-color:#C1272D;background:#fff8f8}

.clg-form-options{display:flex;align-items:center;justify-content:flex-end;font-size:12.5px;margin-top:-10px;margin-bottom:clamp(12px,2vh,23px);gap:10px}
.clg-text-link{border:0;background:transparent;padding:3px 0;color:var(--clg-muted);font-size:inherit;font-weight:650}

.clg-primary{height:46px;width:100%;border:0;border-radius:9px;background:linear-gradient(105deg,#d42e34,#C1272D 55%,#a41e24);color:#fff;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:15px;box-shadow:0 7px 15px #C1272D25;transition:filter .2s,transform .2s}
.clg-primary:hover{filter:brightness(1.06);transform:translateY(-1px)}
.clg-primary:disabled{opacity:.7;cursor:wait;transform:none}
.clg-primary svg{height:16px;width:16px}
.clg-primary .clg-btn-loading{display:none;align-items:center;gap:8px}
.clg-primary.clg-loading .clg-btn-text,.clg-primary.clg-loading svg{display:none}
.clg-primary.clg-loading .clg-btn-loading{display:flex}
.clg-spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:clg-spin .8s linear infinite}

.clg-alert{padding:.875rem 1rem;border-radius:.75rem;margin-bottom:1rem;font-size:.8125rem;line-height:1.5;display:flex;align-items:center;gap:.5rem}
.clg-alert svg{flex:none;width:16px;height:16px}
.clg-alert-info{background:transparent;border:1px solid var(--clg-line);color:var(--clg-ink)}
.clg-alert-danger{background:#fdf1f1;border:1px solid #f0b0b2;color:#96181e}
.clg-alert-success{background:#f0fdf6;border:1px solid #a7e8cf;color:#0f6b4c}

.clg-recaptcha{display:flex;justify-content:center;margin:4px 0 clamp(10px,1.6vh,18px)}

.clg-signup{text-align:center;border-top:1px solid #f1eff6;padding-top:clamp(12px,2vh,23px);margin-top:clamp(12px,2.2vh,26px);font-size:12px;color:#65687b}
.clg-signup a,.clg-signup button{margin-left:3px;color:var(--clg-red);font-weight:700;border:0;background:transparent;padding:0;font-size:inherit}
.clg-secure{display:flex;justify-content:center;align-items:center;gap:7px;color:#96181e;font-size:11.5px;font-weight:650;margin-top:clamp(10px,1.8vh,20px);background:#fdf1f1;border:1px solid #f5c9cb;border-radius:20px;padding:7px 14px}
.clg-secure svg{width:13px;height:13px;color:#C1272D}

.clg-outside{display:flex;justify-content:center;gap:7px;margin-top:clamp(10px,1.8vh,22px);color:#66697b;font-size:12px}
.clg-outside a{color:#C1272D;font-weight:650}

.clg-footer{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#6e7183;gap:20px;flex:0 0 auto}
.clg-footer-left{display:flex;gap:18px;align-items:center}
.clg-footer-left span+span{border-left:1px solid #dddce8;padding-left:18px}
.clg-footer-right{display:flex;gap:18px;align-items:center}

/* Register / Recoverpw - tek kolonlu ortalanmis sayfa govdesi */
.clg-center-wrap{min-height:calc(100vh - 110px);display:flex;align-items:center;justify-content:center;padding:24px 0}
.clg-icon-badge{width:56px;height:56px;background:#fde8e9;border:1px solid #fde0e1;border-radius:16px;display:grid;place-items:center;color:#C1272D;margin:0 auto 22px}
.clg-icon-badge svg{width:28px;height:28px}
.clg-back-link{display:inline-flex;align-items:center;gap:8px;color:#55596f;font-size:13px;font-weight:600;margin-bottom:20px}
.clg-back-link:hover{color:var(--clg-red)}
.clg-back-link svg{width:15px;height:15px}
.clg-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:480px){.clg-row2{grid-template-columns:1fr}}
.clg-terms-note{color:#55596f;font-size:12px;line-height:1.6;margin:0 0 19px}
.clg-terms-note a{color:var(--clg-red);font-weight:600}
.terms-footer-hidden{display:none!important}
.terms-footer-visible{display:flex!important}
.clg-header-logo.clg-header-logo-sm img{width:130px}

/* Mobile app CTA (login formunun ustunde, sadece mobil genislikte) */
.clg-mobile-app-cta{display:none}
@media(max-width:768px){
    .clg-mobile-app-cta{
        display:flex;align-items:center;justify-content:center;gap:8px;
        width:100%;margin:0 0 18px;padding:14px;border:none;border-radius:12px;
        background:linear-gradient(135deg,#d42e34,#a41e24);color:#fff;
        font-size:15px;font-weight:700;text-decoration:none;
        box-shadow:0 8px 24px rgba(193,39,45,.3);
    }
    .clg-mobile-app-cta svg{width:20px;height:20px}
}

/* Animasyonlar */
.clg-robot-arm{transform-origin:312px 192px;animation:clg-robot 6s ease-in-out infinite}
.clg-package{animation:clg-travel 8s linear infinite}
.clg-package.p2{animation-delay:-2.66s}
.clg-package.p3{animation-delay:-5.33s}
.clg-data-flow{stroke-dasharray:4 8;animation:clg-dash 3s linear infinite}
.clg-beacon{animation:clg-pulse 2.7s ease-out infinite;transform-box:fill-box;transform-origin:center}
.clg-scene-glow{animation:clg-glow 5s ease-in-out infinite}
.clg-scene-label{font-family:'DM Sans',sans-serif;font-size:9px;fill:#878298;letter-spacing:1px}

@keyframes clg-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes clg-robot{0%,20%,100%{transform:rotate(0)}45%,65%{transform:rotate(-13deg)}}
@keyframes clg-travel{0%{transform:translate(0,0);opacity:0}8%{opacity:1}88%{opacity:1}100%{transform:translate(185px,95px);opacity:0}}
@keyframes clg-dash{to{stroke-dashoffset:-72}}
@keyframes clg-pulse{0%{opacity:.5;transform:scale(.5)}100%{opacity:0;transform:scale(2.3)}}
@keyframes clg-glow{50%{opacity:.4}}
@keyframes clg-spin{to{transform:rotate(360deg)}}

/* Responsive */
@media(min-width:1450px){
    .clg-main{gap:8%}
    .clg-stage{height:clamp(150px,27vh,345px)}
    .clg-login-card{padding-left:40px;padding-right:40px}
    .clg-login-side{max-width:460px}
    .clg-feature p{font-size:11px}
    .clg-intro{font-size:clamp(12.5px,1.5vh,15px)}
}
@media(max-width:1050px){
    .clg-page{padding-left:4%;padding-right:4%}
    .clg-main{gap:4%;grid-template-columns:minmax(0,1.2fr) minmax(330px,1fr)}
    .clg-h1{font-size:clamp(28px,4.4vw,38px)}
    .clg-login-card{padding-left:25px;padding-right:25px}
    .clg-stage{height:clamp(140px,25vh,285px)}
    .clg-oee-card{transform:scale(.9);left:-7px;top:32px}
    .clg-count-card{right:-7px;width:135px}
    .clg-sync-card{bottom:26px;right:-5px}
    .clg-features{gap:2px}
    .clg-feature{padding:12px 8px}
    .clg-feature-top{font-size:10px;gap:5px}
    .clg-intro{font-size:12px}
    .clg-feature-detail{font-size:10px;margin-left:8px}
}
@media(max-width:760px){
    .clg-page{height:auto;min-height:100vh;overflow:visible;padding:22px 24px}
    .clg-login-brand img{width:150px}
    .clg-whatsapp-cta{padding:0 12px;min-height:38px;font-size:12px}
    .clg-main{display:flex;flex-direction:column;padding:38px 0 27px;gap:35px;overflow:visible}
    .clg-showcase{width:100%;max-width:540px;order:2}
    .clg-login-side{max-width:430px;align-self:center;order:1}
    .clg-login-card{padding:30px 27px;border-radius:19px}
    .clg-login-card h2{font-size:25px}
    .clg-h1{font-size:38px}
    .clg-eyebrow{font-size:9px}
    .clg-stage{height:310px}
    .clg-intro{font-size:14px}
    .clg-features{gap:6px}
    .clg-feature-top{font-size:10px}
    .clg-feature-detail{line-height:1.7}
    .clg-footer{flex-direction:column;gap:13px;padding-bottom:4px;font-size:10px}
    .clg-footer-left{font-size:9px}
}
@media (prefers-reduced-motion:reduce){
    .clg-body *,.clg-body *:before,.clg-body *:after{animation:none!important;transition:none!important}
    .clg-package.p2{transform:translate(60px,31px)}
    .clg-package.p3{transform:translate(120px,62px)}
}