*{margin:0;padding:0;box-sizing:border-box}
:root{
  --dark:#0a1f3c;
  --dark2:#0d2648;
  --dark3:#112e54;
  --gold:#60a8e8;
  --gold2:#378add;
  --white:#f0f5fb;
  --muted:rgba(220,235,250,0.6);
  --border:rgba(96,168,232,0.25);
  --border2:rgba(220,235,250,0.12);
  --error:#e05252;
  --success:#4caf82;
}
html{scroll-behavior:smooth}
body{font-family:'Montserrat',sans-serif;background:var(--dark);color:var(--white);min-height:100vh}
a{text-decoration:none;color:inherit}

/* ─── LOGIN ─── */
#loginScreen{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;
}
.login-bg{
  position:absolute;inset:0;
  background:linear-gradient(135deg,#061529 0%,#0a1f3c 50%,#0f2d55 100%);
}
.login-bg::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 60% 60% at 60% 50%,rgba(96,168,232,0.07) 0%,transparent 70%);
}
.login-box{
  position:relative;z-index:1;
  width:100%;max-width:420px;
  border:1px solid var(--border);
  padding:52px 48px;
  background:rgba(13,38,72,0.6);
  backdrop-filter:blur(12px);
}
.login-logo{text-align:center;margin-bottom:40px}
.login-logo-main{font-family:'Cormorant Garamond',serif;font-size:32px;font-weight:600;color:var(--white);letter-spacing:3px}
.login-logo-sub{font-size:9px;font-weight:500;letter-spacing:4px;color:var(--gold);text-transform:uppercase;margin-top:4px}
.login-logo-badge{
  display:inline-block;margin-top:16px;
  background:rgba(96,168,232,0.12);border:1px solid var(--border);
  color:var(--muted);font-size:9px;letter-spacing:3px;text-transform:uppercase;
  padding:5px 16px;
}
.login-title{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:300;color:var(--white);margin-bottom:32px;text-align:center}
.lf{margin-bottom:22px}
.lf label{font-size:9px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:8px}
.lf input{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--border2);
  color:var(--white);padding:10px 0;font-family:'Montserrat',sans-serif;
  font-size:14px;font-weight:300;outline:none;transition:border-color 0.2s;
}
.lf input::placeholder{color:rgba(220,235,250,0.25)}
.lf input:focus{border-bottom-color:var(--gold)}
.btn-login{
  width:100%;background:var(--gold);color:var(--dark);border:none;
  padding:14px;font-size:10px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;
  cursor:pointer;font-family:'Montserrat',sans-serif;transition:background 0.25s;margin-top:8px;
}
.btn-login:hover{background:var(--gold2)}
.login-error{
  display:none;margin-top:16px;padding:12px 16px;
  border-left:2px solid var(--error);background:rgba(224,82,82,0.08);
  font-size:12px;color:rgba(220,235,250,0.8);
}
.login-back{text-align:center;margin-top:24px;font-size:11px;color:var(--muted);letter-spacing:0.5px}
.login-back a{color:var(--gold);transition:opacity 0.2s}
.login-back a:hover{opacity:0.7}

/* ─── ADMIN PANEL ─── */
#adminPanel{display:none}

/* TOP BAR */
.admin-topbar{
  background:#061529;border-bottom:1px solid var(--border);
  padding:0 5%;height:64px;display:flex;align-items:center;justify-content:space-between;
  position:sticky;top:0;z-index:100;
}
.admin-logo{display:flex;flex-direction:column}
.admin-logo-main{font-family:'Cormorant Garamond',serif;font-size:20px;font-weight:600;color:var(--white);letter-spacing:2px;line-height:1}
.admin-logo-sub{font-size:8px;font-weight:500;letter-spacing:3px;color:var(--gold);text-transform:uppercase;margin-top:3px}
.admin-topbar-right{display:flex;align-items:center;gap:20px}
.admin-user{font-size:11px;color:var(--muted);letter-spacing:0.5px}
.admin-user span{color:var(--gold);font-weight:500}
.btn-logout{
  background:transparent;border:1px solid var(--border2);color:var(--muted);
  padding:7px 18px;font-size:9px;font-weight:500;letter-spacing:2px;text-transform:uppercase;
  cursor:pointer;font-family:'Montserrat',sans-serif;transition:all 0.2s;
}
.btn-logout:hover{border-color:var(--error);color:var(--error)}

/* LAYOUT */
.admin-layout{display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 64px)}

/* SIDEBAR */
.admin-sidebar{
  background:var(--dark2);border-right:1px solid var(--border2);
  padding:32px 0;position:sticky;top:64px;height:calc(100vh - 64px);overflow-y:auto;
}
.sidebar-section{margin-bottom:8px}
.sidebar-label{font-size:9px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:rgba(220,235,250,0.3);padding:0 24px;margin-bottom:8px;display:block}
.sidebar-link{
  display:flex;align-items:center;gap:12px;padding:11px 24px;
  font-size:11px;font-weight:500;letter-spacing:0.5px;color:var(--muted);
  cursor:pointer;transition:all 0.2s;border-left:2px solid transparent;
}
.sidebar-link:hover{color:var(--white);background:rgba(96,168,232,0.05)}
.sidebar-link.active{color:var(--gold);border-left-color:var(--gold);background:rgba(96,168,232,0.08)}
.sidebar-link svg{width:15px;height:15px;stroke:currentColor;flex-shrink:0}

/* MAIN CONTENT */
.admin-main{padding:40px 48px;background:var(--dark)}

/* PAGE HEADER */
.page-header{margin-bottom:36px;padding-bottom:28px;border-bottom:1px solid var(--border2);display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.page-eyebrow{font-size:9px;font-weight:500;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.page-title{font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:300;color:var(--white)}
.btn-primary{
  background:var(--gold);color:var(--dark);border:none;
  padding:11px 28px;font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;
  cursor:pointer;font-family:'Montserrat',sans-serif;transition:background 0.25s;white-space:nowrap;
}
.btn-primary:hover{background:var(--gold2)}
.btn-secondary{
  background:transparent;border:1px solid var(--border);color:var(--muted);
  padding:11px 24px;font-size:10px;font-weight:500;letter-spacing:2px;text-transform:uppercase;
  cursor:pointer;font-family:'Montserrat',sans-serif;transition:all 0.25s;
}
.btn-secondary:hover{border-color:var(--muted);color:var(--white)}

/* FORM CARD */
.form-card{background:var(--dark2);border:1px solid var(--border2);padding:40px}
.form-section-title{font-size:9px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:24px;display:flex;align-items:center;gap:12px}
.form-section-title::after{content:'';flex:1;height:1px;background:var(--border2)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.ff{margin-bottom:28px}
.ff label{font-size:9px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--gold);display:block;margin-bottom:10px}
.ff input,.ff textarea,.ff select{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--border2);
  color:var(--white);padding:10px 0;font-family:'Montserrat',sans-serif;
  font-size:13px;font-weight:300;outline:none;transition:border-color 0.2s;
}
.ff input::placeholder,.ff textarea::placeholder{color:rgba(220,235,250,0.2)}
.ff input:focus,.ff textarea:focus,.ff select:focus{border-bottom-color:var(--gold)}
.ff textarea{min-height:140px;resize:vertical;line-height:1.8}
.ff select{appearance:none;cursor:pointer}
.ff select option{background:var(--dark2);color:var(--white)}
.ff-hint{font-size:10px;color:rgba(220,235,250,0.3);margin-top:6px;letter-spacing:0.3px}

/* IMAGE UPLOAD */
.img-upload-area{
  border:1px dashed var(--border);padding:32px;text-align:center;
  cursor:pointer;transition:all 0.25s;position:relative;
}
.img-upload-area:hover{border-color:var(--gold);background:rgba(96,168,232,0.04)}
.img-upload-area.has-image{padding:0;border-style:solid}
.img-upload-area input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.img-upload-icon{width:40px;height:40px;margin:0 auto 12px;opacity:0.4}
.img-upload-icon svg{width:100%;height:100%;stroke:var(--gold)}
.img-upload-text{font-size:11px;color:var(--muted);letter-spacing:0.5px;line-height:1.6}
.img-upload-text span{color:var(--gold)}
.img-preview{width:100%;height:200px;object-fit:cover;display:none}
.img-preview.visible{display:block}
.img-or{
  display:flex;align-items:center;gap:12px;margin:16px 0;
  font-size:9px;letter-spacing:2px;text-transform:uppercase;color:rgba(220,235,250,0.3);
}
.img-or::before,.img-or::after{content:'';flex:1;height:1px;background:var(--border2)}

/* CONTENT EDITOR */
.editor-toolbar{
  display:flex;gap:4px;flex-wrap:wrap;padding:12px;
  background:var(--dark3);border:1px solid var(--border2);border-bottom:none;
}
.tb-btn{
  background:transparent;border:1px solid transparent;color:var(--muted);
  padding:5px 10px;font-size:11px;font-weight:500;cursor:pointer;font-family:'Montserrat',sans-serif;
  transition:all 0.2s;border-radius:2px;
}
.tb-btn:hover{border-color:var(--border2);color:var(--white);background:rgba(96,168,232,0.08)}
.tb-sep{width:1px;background:var(--border2);margin:0 4px;align-self:stretch}
.editor-area{
  width:100%;background:transparent;border:1px solid var(--border2);
  color:var(--white);padding:16px;font-family:'Montserrat',sans-serif;
  font-size:13px;font-weight:300;outline:none;transition:border-color 0.2s;
  min-height:240px;resize:vertical;line-height:1.9;
}
.editor-area:focus{border-color:var(--gold)}
.editor-hint{font-size:10px;color:rgba(220,235,250,0.3);margin-top:8px;line-height:1.7}

/* PREVIEW BADGE */
.status-bar{
  display:flex;align-items:center;gap:16px;padding:16px 20px;
  background:rgba(96,168,232,0.06);border:1px solid var(--border2);margin-bottom:28px;
}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--gold);animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.4}}
.status-text{font-size:11px;color:var(--muted);letter-spacing:0.5px}

/* FORM ACTIONS */
.form-actions{display:flex;gap:16px;align-items:center;padding-top:32px;border-top:1px solid var(--border2);margin-top:8px;flex-wrap:wrap}
.save-indicator{font-size:10px;color:rgba(220,235,250,0.3);letter-spacing:0.5px;margin-left:auto}

/* SUCCESS MESSAGE */
.publish-success{
  display:none;padding:20px 24px;border-left:2px solid var(--success);
  background:rgba(76,175,130,0.08);margin-bottom:24px;
}
.publish-success p{font-size:13px;color:var(--white);font-weight:300}
.publish-success span{color:var(--success);font-weight:500}

/* POSTS LIST */
.posts-list{margin-top:0}
.post-item{
  display:grid;grid-template-columns:80px 1fr auto;gap:20px;align-items:center;
  padding:20px 0;border-bottom:1px solid var(--border2);
}
.post-item:last-child{border-bottom:none}
.post-thumb{width:80px;height:56px;object-fit:cover;background:var(--dark3);display:block}
.post-thumb-placeholder{width:80px;height:56px;background:var(--dark3);display:flex;align-items:center;justify-content:center}
.post-thumb-placeholder svg{width:20px;height:20px;stroke:rgba(96,168,232,0.3)}
.post-info h4{font-size:14px;font-weight:400;color:var(--white);margin-bottom:4px;font-family:'Cormorant Garamond',serif}
.post-meta-row{display:flex;gap:12px;align-items:center}
.post-cat-badge{font-size:9px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;background:var(--gold);color:var(--dark);padding:3px 8px}
.post-date-label{font-size:10px;color:var(--muted)}
.post-actions{display:flex;gap:8px}
.btn-icon{background:transparent;border:1px solid var(--border2);color:var(--muted);padding:6px 12px;font-size:10px;cursor:pointer;font-family:'Montserrat',sans-serif;transition:all 0.2s;letter-spacing:1px}
.btn-icon:hover{border-color:var(--gold);color:var(--gold)}
.btn-icon.danger:hover{border-color:var(--error);color:var(--error)}

/* STATS CARDS */
.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:36px}
.stat-card{background:var(--dark2);border:1px solid var(--border2);padding:24px 28px}
.stat-card-n{font-family:'Cormorant Garamond',serif;font-size:40px;font-weight:300;color:var(--gold);line-height:1}
.stat-card-l{font-size:9px;font-weight:500;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-top:6px}

/* TABS */
.tabs{display:flex;gap:0;border-bottom:1px solid var(--border2);margin-bottom:32px}
.tab{
  padding:12px 24px;font-size:10px;font-weight:500;letter-spacing:2px;text-transform:uppercase;
  color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;transition:all 0.2s;
  margin-bottom:-1px;
}
.tab:hover{color:var(--white)}
.tab.active{color:var(--gold);border-bottom-color:var(--gold)}
.tab-content{display:none}
.tab-content.active{display:block}

@media(max-width:900px){
  .admin-layout{grid-template-columns:1fr}
  .admin-sidebar{display:none}
  .admin-main{padding:24px 20px}
  .form-grid{grid-template-columns:1fr}
  .stats-row{grid-template-columns:1fr 1fr}
  .page-header{flex-direction:column;align-items:flex-start}
  .post-item{grid-template-columns:60px 1fr;grid-template-rows:auto auto}
  .post-actions{grid-column:1/-1}
}
@media(max-width:480px){
  .login-box{padding:36px 28px}
  .stats-row{grid-template-columns:1fr}
  .tabs{overflow-x:auto}
}
  .blog-featured-img{height:220px}
}
@media(max-width:580px){
  .services-grid,.portfolio-grid,.stats-box,.form-row,.blog-grid,.blog-form-grid{grid-template-columns:1fr}
  .nav-links a:not(.nav-cta):not(:last-child):not(:nth-last-child(2)){display:none}
  .hero-stats{flex-direction:column;gap:24px}
  .hero-stat{border-right:none!important;padding-right:0!important;padding-left:0!important;border-bottom:1px solid var(--border2);padding-bottom:16px!important}
  .footer-cols{grid-template-columns:1fr}
  .blog-modal{padding:32px 24px}
}

/* CLIENTES TICKER */
.clientes-strip{
  background:var(--dark);
  border-top:1px solid var(--border2);
  border-bottom:1px solid var(--border2);
  padding:48px 0;overflow:hidden;
}
.clientes-header{
  text-align:center;margin-bottom:32px;padding:0 5%;
}
.clientes-track-wrap{
  overflow:hidden;position:relative;
  mask-image:linear-gradient(to right,transparent 0%,black 8%,black 92%,transparent 100%);
  -webkit-mask-image:linear-gradient(to right,transparent 0%,black 8%,black 92%,transparent 100%);
}
.clientes-track{
  display:flex;gap:20px;width:max-content;
  animation:tickerScroll 28s linear infinite;
}
.clientes-track:hover{animation-play-state:paused}
.cliente-logo{
  width:160px;height:56px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  color:rgba(220,235,250,0.3);transition:color 0.3s;cursor:default;
}
.cliente-logo:hover{color:var(--gold)}
.cliente-logo svg{width:100%;height:100%}
@keyframes tickerScroll{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
@media(max-width:900px){
  .services-top,.nosotros-grid,.contact-grid,.portfolio-intro,.blog-top,.blog-featured{grid-template-columns:1fr}
  .hero-content{padding-left:0}
  .services-grid,.portfolio-grid,.blog-grid{grid-template-columns:1fr 1fr}
  .footer-top{grid-template-columns:1fr}
  .footer-cols{grid-template-columns:1fr 1fr}
  .topbar-left{display:none}
  .blog-featured-img{height:220px}
}
@media(max-width:580px){
  .services-grid,.portfolio-grid,.stats-box,.form-row,.blog-grid,.blog-form-grid{grid-template-columns:1fr}
  .nav-links a:not(.nav-cta):not(:last-child):not(:nth-last-child(2)){display:none}
  .hero-stats{flex-direction:column;gap:24px}
  .hero-stat{border-right:none!important;padding-right:0!important;padding-left:0!important;border-bottom:1px solid var(--border2);padding-bottom:16px!important}
  .footer-cols{grid-template-columns:1fr}
  .blog-modal{padding:32px 24px}
}