:root{--dsp-navy:#062a4a;--dsp-blue:#0c5790;--dsp-orange:#ff7400;--dsp-text:#132c44}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif}
body{min-height:100vh;color:#fff;background:
 radial-gradient(circle at 18% 18%,rgba(24,126,207,.22),transparent 30%),
 linear-gradient(118deg,#05233e 0%,#0b4c7e 55%,#061d33 100%);overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.10;background-image:
 linear-gradient(rgba(83,157,215,.22) 1px,transparent 1px),
 linear-gradient(90deg,rgba(83,157,215,.22) 1px,transparent 1px);background-size:44px 44px}
.dsp-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr)}
.dsp-showcase{padding:54px clamp(44px,6vw,92px);display:flex;flex-direction:column;justify-content:center;position:relative}
.dsp-company{display:flex;align-items:center;gap:20px;margin-bottom:42px}
.dsp-company img{width:165px;max-height:96px;object-fit:contain;border-radius:8px}
.dsp-company-line{width:1px;height:52px;background:rgba(255,255,255,.32)}
.dsp-company p{margin:0;color:#d5e5f1;line-height:1.45;font-size:.94rem}
.dsp-product{display:flex;align-items:center;gap:22px;max-width:720px}
.dsp-product-icon{width:108px;height:108px;flex:0 0 108px;filter:drop-shadow(0 12px 22px rgba(0,0,0,.2))}
.dsp-product h1{font-size:clamp(2.35rem,4vw,3.85rem);line-height:.96;margin:0;font-weight:900;letter-spacing:-.035em}
.dsp-product h1 span{color:var(--dsp-orange)}
.dsp-product .subtitle{font-size:.72rem;letter-spacing:.25em;margin:15px 0 11px;color:#dbe8f2}
.dsp-product .desc{font-size:1rem;line-height:1.55;color:#d9e7f2;margin:0;max-width:570px}
.dsp-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:34px;max-width:700px}
.dsp-feature{padding:13px 14px;border:1px solid rgba(76,160,224,.38);border-radius:12px;background:rgba(3,31,55,.23)}
.dsp-feature i{font-size:1.35rem}.dsp-feature strong{display:block;margin-top:8px;font-size:.84rem}
.dsp-feature small{display:block;color:#aac7dd;font-size:.69rem;margin-top:2px}
.dsp-footer{position:absolute;left:clamp(44px,6vw,92px);bottom:24px;color:#9ebbd1;font-size:.69rem}.dsp-footer strong{color:#dceaf4}
.dsp-access{display:flex;align-items:center;justify-content:center;padding:44px clamp(30px,5vw,70px);background:rgba(0,0,0,.10)}
.dsp-card{width:min(100%,500px);background:#fff;color:var(--dsp-text);border-radius:20px;padding:34px 38px;box-shadow:0 24px 60px rgba(0,18,34,.30)}
.dsp-card-head{text-align:center}
.dsp-card-brand{display:flex;justify-content:center;align-items:center;gap:12px;margin-bottom:8px}
.dsp-card-brand img{width:54px;height:54px}
.dsp-card-title{font-weight:900;line-height:1.02;font-size:1.55rem;color:#102944}
.dsp-card-title span{color:var(--dsp-orange)}
.dsp-card-head p{color:#60758a;margin:10px auto 24px;max-width:340px;line-height:1.45;font-size:.88rem}
.dsp-form label{display:block;font-size:.78rem;font-weight:750;margin:12px 0 6px}
.dsp-input{position:relative}
.dsp-input i{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:#7b8e9f;font-size:1.05rem}
.dsp-input input{width:100%;height:47px;border:1px solid #d4dfe8;border-radius:9px;padding:0 42px 0 39px;font-size:.9rem;outline:0;background:#fff}
.dsp-input input:focus{border-color:#5b9ed1;box-shadow:0 0 0 3px rgba(12,87,144,.08)}
.dsp-eye{position:absolute;right:8px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:#73889b;cursor:pointer;padding:7px}
.dsp-form-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:13px 0}
.dsp-remember{display:flex!important;align-items:center;gap:7px!important;margin:0!important;font-weight:500!important;font-size:.78rem!important}
.dsp-remember input{accent-color:var(--dsp-orange);width:16px;height:16px}
.dsp-link{color:#0871c1;text-decoration:none;font-size:.78rem}
.dsp-submit{width:100%;height:49px;border:0;border-radius:9px;background:linear-gradient(90deg,#ff7400,#ff861a);color:#fff;font-weight:800;font-size:.96rem;cursor:pointer;box-shadow:0 7px 16px rgba(255,116,0,.18)}
.dsp-submit:hover{filter:brightness(.97)}
.dsp-help{text-align:center;margin-top:18px;padding-top:16px;border-top:1px solid #e4eaf0}
.dsp-help a{color:#0c5790;text-decoration:none;font-weight:700;font-size:.8rem}
.dsp-security{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:16px;color:#8192a1;font-size:.65rem}.dsp-security i{color:#0c5790}

@media(max-width:1050px){
  .dsp-shell{grid-template-columns:1fr;min-height:100vh}
  .dsp-showcase{padding:28px 28px 14px;justify-content:flex-start}
  .dsp-company{margin-bottom:22px;justify-content:center}.dsp-company-line,.dsp-company p{display:none}
  .dsp-company img{width:145px;max-height:84px}
  .dsp-product{justify-content:center;text-align:center;margin:0 auto}
  .dsp-product-icon{width:76px;height:76px;flex-basis:76px}
  .dsp-product h1{font-size:2.2rem}.dsp-product .subtitle{font-size:.62rem;letter-spacing:.18em}.dsp-product .desc{font-size:.88rem}
  .dsp-features{display:none}
  .dsp-footer{display:none}
  .dsp-access{padding:16px 22px 36px;background:transparent}
  .dsp-card{max-width:520px;padding:28px 30px}
}
@media(max-width:620px){
  body{background:linear-gradient(160deg,#062a4a 0%,#0b4c7e 46%,#edf4f8 46%,#edf4f8 100%)}
  body:before{display:none}
  .dsp-showcase{padding:22px 18px 8px}
  .dsp-company{margin-bottom:12px}.dsp-company img{width:120px;max-height:68px}
  .dsp-product{display:block}
  .dsp-product-icon{width:58px;height:58px;margin:0 auto 8px}
  .dsp-product h1{font-size:1.65rem;line-height:1}.dsp-product .subtitle{display:none}.dsp-product .desc{font-size:.78rem;line-height:1.4;max-width:320px;margin:8px auto 0}
  .dsp-access{padding:12px 14px 28px}
  .dsp-card{padding:24px 20px;border-radius:16px;box-shadow:0 14px 34px rgba(0,25,45,.18)}
  .dsp-card-brand{margin-bottom:5px}.dsp-card-brand img{width:42px;height:42px}.dsp-card-title{font-size:1.25rem}
  .dsp-card-head p{font-size:.78rem;margin:8px auto 18px}
  .dsp-input input{height:45px}.dsp-form-row{margin:12px 0}
  .dsp-security{display:none}
}


/* 0.12.17 — identidad corporativa y responsive compacto */
.dsp-company img{
  width:150px;
  max-height:82px;
  object-fit:contain;
  border-radius:0;
  background:transparent;
}
@media (max-width:1050px){
  .dsp-shell{display:block;min-height:100vh}
  .dsp-showcase{
    min-height:auto;
    padding:24px 24px 12px;
    display:block;
  }
  .dsp-company{
    margin:0 auto 12px;
    justify-content:center;
  }
  .dsp-company img{width:118px;max-height:66px}
  .dsp-company-line,.dsp-company p{display:none}
  .dsp-product{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    text-align:left;
    margin:0 auto;
    max-width:480px;
  }
  .dsp-product-icon{width:54px;height:54px;flex:0 0 54px;margin:0}
  .dsp-product h1{font-size:1.55rem;line-height:.98}
  .dsp-product .subtitle,.dsp-product .desc,.dsp-features,.dsp-footer{display:none}
  .dsp-access{padding:10px 18px 30px;background:transparent}
  .dsp-card{max-width:500px;padding:26px 28px}
}
@media (max-width:620px){
  body{
    background:linear-gradient(180deg,#062a4a 0,#0b4c7e 31%,#eef4f8 31%,#eef4f8 100%);
  }
  .dsp-showcase{padding:15px 14px 7px}
  .dsp-company{margin-bottom:6px}
  .dsp-company img{width:92px;max-height:52px}
  .dsp-product{gap:9px}
  .dsp-product-icon{width:42px;height:42px;flex-basis:42px}
  .dsp-product h1{font-size:1.22rem;line-height:1}
  .dsp-access{padding:7px 11px 22px}
  .dsp-card{
    width:100%;
    max-width:440px;
    padding:20px 17px;
    border-radius:15px;
  }
  .dsp-card-brand img{width:36px;height:36px}
  .dsp-card-title{font-size:1.12rem}
  .dsp-card-head p{margin:6px auto 14px;font-size:.75rem;line-height:1.35}
  .dsp-form label{margin:9px 0 5px}
  .dsp-input input{height:43px}
  .dsp-form-row{margin:10px 0}
  .dsp-submit{height:45px}
  .dsp-help{margin-top:14px;padding-top:13px}
}


/* 0.12.18 — mejor contraste del logo corporativo sin hacerlo invasivo */
.dsp-company img{
  width:154px;
  max-height:86px;
  object-fit:contain;
  padding:7px 10px;
  border-radius:12px;
  background:rgba(255,255,255,.10);
  box-shadow:0 8px 24px rgba(0,19,35,.10);
  backdrop-filter:blur(2px);
}
@media(max-width:1050px){
  .dsp-company img{
    width:118px;
    max-height:68px;
    padding:5px 8px;
    border-radius:10px;
  }
}
@media(max-width:620px){
  .dsp-company img{
    width:94px;
    max-height:54px;
    padding:4px 7px;
  }
}


/* =========================================================
   Datelco Support Premium 0.12.25 — Premium visual refinement
   Visual only: no authentication/session behavior changes.
   ========================================================= */
:root{
  --dsp-navy:#082f52;
  --dsp-navy-deep:#041f38;
  --dsp-blue:#0b4f80;
  --dsp-orange:#ff7300;
  --dsp-text:#102c49;
  --dsp-muted:#647c92;
  --dsp-line:rgba(255,255,255,.12);
}

.dsp-shell{
  background:
    radial-gradient(circle at 17% 18%,rgba(24,133,207,.18),transparent 31%),
    radial-gradient(circle at 70% 72%,rgba(255,115,0,.055),transparent 27%),
    linear-gradient(115deg,var(--dsp-navy-deep) 0%,#0a426d 48%,#062b49 100%);
}
.dsp-shell:before{
  content:"";
  position:fixed; inset:0; pointer-events:none; opacity:.24;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.7) 52%,transparent 78%);
}
.dsp-shell:after{
  content:""; position:fixed; width:620px; height:620px; left:-260px; bottom:-380px;
  border:1px solid rgba(35,154,226,.22); border-radius:50%; pointer-events:none;
  box-shadow:0 0 0 85px rgba(35,154,226,.025),0 0 0 170px rgba(35,154,226,.018);
}

.dsp-brand{
  position:relative;
  padding-top:clamp(34px,6vh,76px);
  padding-bottom:36px;
}
.dsp-corporate{
  align-items:center;
  gap:22px;
}
.dsp-corporate-logo{
  background:rgba(255,255,255,.075) !important;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 16px 40px rgba(0,0,0,.12);
  backdrop-filter:blur(8px);
}
.dsp-corporate-logo img{
  filter:brightness(1.22) contrast(1.08);
}
.dsp-slogan{
  color:rgba(255,255,255,.91);
  font-weight:500;
}
.dsp-product{
  margin-top:clamp(50px,8vh,90px);
}
.dsp-product h1{
  letter-spacing:-2px;
  line-height:.93;
  text-shadow:0 10px 28px rgba(0,0,0,.10);
}
.dsp-product-subtitle{
  color:rgba(255,255,255,.79);
}
.dsp-benefits{
  gap:14px;
}
.dsp-benefit{
  background:rgba(3,36,62,.36);
  border-color:rgba(78,173,231,.32);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(7px);
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.dsp-benefit:hover{
  transform:translateY(-2px);
  border-color:rgba(255,115,0,.55);
  background:rgba(3,36,62,.5);
}

.dsp-login-side{
  position:relative;
}
.dsp-login-card{
  max-width:570px;
  border:1px solid rgba(255,255,255,.68);
  box-shadow:0 30px 80px rgba(0,20,38,.32),0 2px 8px rgba(0,0,0,.08);
  backdrop-filter:blur(14px);
}
.dsp-login-card:before{
  content:"";
  position:absolute;
  width:110px;height:4px;top:0;left:50%;transform:translateX(-50%);
  border-radius:0 0 5px 5px;
  background:linear-gradient(90deg,#0c72b8,var(--dsp-orange));
}
.dsp-product-logo{
  margin-bottom:10px;
}
.dsp-product-logo img{
  filter:drop-shadow(0 8px 15px rgba(6,63,106,.12));
}
.dsp-login-kicker{
  margin:12px 0 3px;
  font-size:12px;
  letter-spacing:.2em;
  font-weight:800;
  color:#0b6098;
}
.dsp-login-lead{
  margin-top:0;
  font-size:17px;
  color:var(--dsp-muted);
}
.dsp-form label{
  color:var(--dsp-text);
}
.dsp-input-wrap{
  position:relative;
  display:flex;
  align-items:center;
}
.dsp-input-wrap input{
  width:100%;
  padding-left:48px !important;
  padding-right:66px !important;
}
.dsp-input-icon{
  position:absolute;
  left:17px;
  z-index:2;
  width:19px;height:19px;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;
  filter:grayscale(1);
  opacity:.55;
  pointer-events:none;
}
.dsp-lock-icon{
  font-size:9px;
  border:2px solid #31546e;
  border-radius:5px;
  color:#31546e;
  width:15px;height:13px;
  background:transparent;
}
.dsp-password-toggle{
  position:absolute;
  right:14px;
  border:0;
  background:transparent;
  color:#0876be;
  font-weight:700;
  font-size:12px;
  cursor:pointer;
  padding:8px;
}
.dsp-form input:focus{
  border-color:#1b91d1 !important;
  box-shadow:0 0 0 4px rgba(27,145,209,.11) !important;
}
.dsp-submit{
  box-shadow:0 13px 28px rgba(255,115,0,.20);
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
}
.dsp-submit:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 32px rgba(255,115,0,.27);
  filter:saturate(1.04);
}
.dsp-trust{
  gap:14px;
}
.dsp-trust span{
  display:flex;
  align-items:center;
  gap:5px;
}
.dsp-trust b{
  color:#0d82c8;
  font-size:11px;
}

@media (max-width:900px){
  .dsp-shell:before{opacity:.15;mask-image:none}
  .dsp-brand{
    padding:28px 24px 18px;
    min-height:auto;
  }
  .dsp-corporate{
    justify-content:center;
  }
  .dsp-product,
  .dsp-benefits,
  .dsp-brand-footer{
    display:none !important;
  }
  .dsp-login-side{
    padding:20px 16px 34px;
  }
  .dsp-login-card{
    max-width:560px;
    padding-top:32px;
  }
}
@media (max-width:560px){
  .dsp-corporate .dsp-slogan{display:none}
  .dsp-corporate-logo{
    width:150px !important;
    min-width:150px !important;
  }
  .dsp-login-side{
    padding:10px 12px 26px;
  }
  .dsp-login-card{
    border-radius:22px;
    padding:28px 22px 24px;
  }
  .dsp-product-logo span{
    font-size:25px !important;
  }
  .dsp-login-lead{
    font-size:15px;
  }
  .dsp-trust{
    flex-wrap:wrap;
    justify-content:center;
  }
}


/* 0.12.28 — ajuste conservador del logo Datelco */
.dsp-company img,
.dsp-corporate-logo img{
  object-fit:contain !important;
  image-rendering:auto;
  filter:brightness(1.12) contrast(1.08) drop-shadow(0 5px 10px rgba(0,0,0,.18)) !important;
}
.dsp-company,
.dsp-corporate-logo{
  background:transparent !important;
  box-shadow:none !important;
  border-color:transparent !important;
  backdrop-filter:none !important;
}


/* 0.12.29 — ajuste de encaje vertical a 100% */
@media (min-width: 901px) and (max-height: 900px) {
  .dsp-shell,
  .dsp-portal,
  .dsp-page {
    min-height: 100vh !important;
  }

  .dsp-brand,
  .dsp-marketing,
  .dsp-left {
    padding-top: 28px !important;
    padding-bottom: 24px !important;
  }

  .dsp-corporate,
  .dsp-company {
    margin-bottom: 14px !important;
  }

  .dsp-product {
    margin-top: 6px !important;
  }

  .dsp-product h1 {
    margin-top: 6px !important;
    margin-bottom: 10px !important;
  }

  .dsp-product-description,
  .dsp-product-subtitle {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
  }

  .dsp-benefits {
    margin-top: 20px !important;
  }

  .dsp-brand-footer,
  .dsp-footer {
    margin-top: 14px !important;
    padding-bottom: 2px !important;
  }

  .dsp-login-card {
    transform: scale(.96);
    transform-origin: center center;
  }
}