@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root{
  --black:#0b0906;
  --charcoal:#171310;
  --gold:#e8b87e;
  --amber:#e0a13c;
  --cream:#f4ece0;
  --line:#3a2f26;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{
  background:var(--black);
  color:var(--cream);
  font-family:'Inter', -apple-system, sans-serif;
  font-weight:300;
}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}

/* ===== COVER ===== */
.cover{
  position:relative;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:34px 42px;
  overflow:hidden;
}
.cover-photo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 15%;
  z-index:0;
}
.cover-vignette{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(180deg, rgba(11,9,6,.75) 0%, rgba(11,9,6,.15) 30%, rgba(11,9,6,.1) 55%, rgba(11,9,6,.85) 100%),
    linear-gradient(90deg, rgba(11,9,6,.55) 0%, transparent 40%, transparent 60%, rgba(11,9,6,.55) 100%);
}

.cover-head{
  position:relative;z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
}
.cover-head-right{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
}
.client-access-btn{
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid rgba(232,184,126,.45);
  background:rgba(11,9,6,.35);
  color:var(--gold);
  padding:8px 16px;
  border-radius:30px;
  font-size:.78rem;
  letter-spacing:.04em;
  text-decoration:none;
  backdrop-filter:blur(2px);
  transition:background .2s,border-color .2s;
}
.client-access-btn svg{width:15px;height:15px;flex-shrink:0;}
.client-access-btn:hover{background:rgba(232,184,126,.12);border-color:var(--gold);}

.visitor-badge{
  display:flex;align-items:center;gap:7px;
  font-size:.72rem;
  letter-spacing:.15em;
  color:#cbbda8;
  text-transform:uppercase;
  padding-top:8px;
  white-space:nowrap;
}
.pulse-dot{
  width:7px;height:7px;border-radius:50%;
  background:#5fd97a;
  box-shadow:0 0 0 0 rgba(95,217,122,.6);
  animation:pulse-dot 2s infinite;
}
@keyframes pulse-dot{
  0%{box-shadow:0 0 0 0 rgba(95,217,122,.6);}
  70%{box-shadow:0 0 0 7px rgba(95,217,122,0);}
  100%{box-shadow:0 0 0 0 rgba(95,217,122,0);}
}
.wordmark-title{
  font-family:'Inter', -apple-system, sans-serif;
  font-weight:700;
  font-size:clamp(3rem,9vw,6.2rem);
  line-height:.85;
  background:linear-gradient(120deg,#fff,var(--gold) 55%,var(--amber));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  letter-spacing:.01em;
}
.wordmark-sub{
  font-size:clamp(.8rem,1.6vw,1.15rem);
  letter-spacing:.5em;
  margin-top:6px;
  color:var(--cream);
}
.issue-label{
  font-size:.72rem;
  letter-spacing:.15em;
  color:#cbbda8;
  text-transform:uppercase;
  padding-top:8px;
  white-space:nowrap;
}

.cover-left{
  position:relative;z-index:2;
  max-width:440px;
}
.kicker{
  font-family:'Inter', -apple-system, sans-serif;
  font-size:1.4rem;
  color:var(--cream);
}
.headline{
  font-family:'Inter', -apple-system, sans-serif;
  font-weight:900;
  font-size:clamp(2rem,5vw,3.4rem);
  line-height:.95;
  color:var(--gold);
  margin:4px 0 14px;
}
.subhead div{
  font-size:.95rem;
  letter-spacing:.06em;
  color:#e9ddc9;
  line-height:1.5;
}
.extra{
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:26px;
  text-decoration:none;
  width:fit-content;
  transition:transform .2s;
}
.extra:hover{transform:translateX(4px);}

.studio-address{
  display:flex;align-items:center;gap:8px;
  margin-top:16px;color:#a99a87;font-size:.8rem;letter-spacing:.02em;
}
.studio-address svg{color:var(--amber);flex-shrink:0;}
.plus{font-size:1.8rem;color:var(--amber);font-weight:300;}
.extra-line{color:var(--amber);letter-spacing:.05em;font-weight:500;}
.extra-subline{font-size:.82rem;color:#cbbda8;letter-spacing:.04em;}

/* Los dos links principales: mas grandes y con animacion de color para llamar la atencion */
.extra-highlight{padding:8px 14px;margin-left:-14px;border-radius:8px;animation:extra-bg-pulse 2.2s ease-in-out infinite;}
.extra-highlight .plus{font-size:2.2rem;animation:extra-glow-color 2.2s ease-in-out infinite;}
.extra-highlight .extra-line{font-size:1.08rem;animation:extra-glow-color 2.2s ease-in-out infinite;}
.extra-highlight .extra-subline{font-size:.86rem;}
@keyframes extra-glow-color{
  0%,100%{color:var(--amber);text-shadow:0 0 0 rgba(232,184,126,0);}
  33%{color:#ff9f4a;text-shadow:0 0 18px rgba(255,159,74,.7);}
  66%{color:var(--gold);text-shadow:0 0 18px rgba(232,184,126,.7);}
}
@keyframes extra-bg-pulse{
  0%,100%{background:rgba(232,184,126,0);transform:scale(1);}
  50%{background:rgba(232,184,126,.1);transform:scale(1.03);}
}

.extra-compact{gap:7px;margin-top:10px;}
.extra-compact .plus{font-size:1rem;}
.extra-compact .extra-line{font-size:.68rem;}
.extra-compact .extra-subline{font-size:.58rem;}

.cover-right{
  position:relative;z-index:2;
  align-self:flex-start;
  margin-left:auto;
  margin-top:120px;
  text-align:right;
  display:flex;
  flex-direction:column;
  gap:46px;
  max-width:260px;
}
.coverline-title{
  font-family:'Inter', -apple-system, sans-serif;
  color:var(--gold);
  font-size:1.5rem;
  line-height:1.15;
  font-weight:600;
}
.coverline-body{
  margin-top:6px;
  font-size:.82rem;
  letter-spacing:.05em;
  color:#e9ddc9;
  line-height:1.5;
}

/* ===== ARTICLES ===== */
.articles{padding:90px 0;background:var(--charcoal);border-top:1px solid var(--line);}
.article-card{
  max-width:760px;
  margin:0 auto 60px;
  border-bottom:1px solid var(--line);
  padding-bottom:50px;
}
.article-card:last-child{border-bottom:none;margin-bottom:0;}
.article-card h2{
  font-family:'Inter', -apple-system, sans-serif;
  font-size:2rem;
  color:var(--gold);
  margin-bottom:14px;
}
.article-card p{
  color:#d9cdb9;
  font-size:1.02rem;
  line-height:1.75;
}

/* ===== FOOTER ===== */
.site-foot{padding:26px 0;border-top:1px solid var(--line);}
.site-foot .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:.8rem;color:#8a7c6c;}
.site-foot a{color:#8a7c6c;text-decoration:none;}
.site-foot a:hover{color:var(--gold);}

@media(max-width:820px){
  .cover{padding:22px 20px;}
  .cover-head{flex-direction:column;gap:14px;}
  .cover-head-right{align-items:flex-start;width:100%;}
  .cover-right{margin-top:60px;text-align:left;margin-left:0;gap:30px;}
}

/* ===== ADMIN ===== */
.admin-body{min-height:100vh;background:var(--black);color:var(--cream);font-family:'Inter', -apple-system, sans-serif;}
.admin-wrap{max-width:820px;margin:0 auto;padding:40px 20px;}
.admin-card{background:var(--charcoal);border:1px solid var(--line);border-radius:6px;padding:34px;margin-bottom:28px;}
.admin-card h2{font-family:'Inter', -apple-system, sans-serif;color:var(--gold);margin-bottom:18px;font-size:1.4rem;}
.admin-body label{display:block;font-size:.8rem;letter-spacing:.04em;color:#cbbda8;margin:14px 0 6px;text-transform:uppercase;}
.admin-body input[type=text], .admin-body textarea, .admin-body input[type=password]{
  width:100%;background:#0f0c09;border:1px solid var(--line);color:var(--cream);
  padding:11px 14px;border-radius:4px;font-family:'Inter', -apple-system, sans-serif;font-size:.95rem;
}
.admin-body textarea{resize:vertical;min-height:70px;}
.admin-body button{
  margin-top:22px;background:linear-gradient(120deg,var(--amber),#c9622c);
  color:#160f08;border:none;padding:13px 26px;border-radius:4px;font-weight:600;
  letter-spacing:.03em;text-transform:uppercase;font-size:.85rem;cursor:pointer;
}
.admin-body button:hover{opacity:.92;}
.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;}
.admin-header h1{font-family:'Inter', -apple-system, sans-serif;color:var(--gold);font-size:1.8rem;}

/* =========================================================
   ADMIN STAFF PANEL — light, professional work-tool theme.
   Scoped to .admin-staff so the customer-facing client
   portal (which reuses some of the same class names) keeps
   its dark magazine styling untouched.
========================================================= */
.admin-staff{
  --adm-bg:#f4f5f7;
  --adm-surface:#ffffff;
  --adm-border:#e2e4e9;
  --adm-text:#1f2328;
  --adm-text-muted:#6b7280;
  --adm-accent:#a8681f;
  --adm-accent-soft:#f6ead7;
  --adm-danger:#b3382c;
  --adm-danger-soft:#fbe9e7;
  --adm-success:#2f7a4d;
  --adm-success-soft:#e6f4ea;
  background:var(--adm-bg);
  color:var(--adm-text);
}
.admin-staff label{color:var(--adm-text-muted);}
.admin-staff input[type=text],
.admin-staff input[type=password],
.admin-staff input[type=file],
.admin-staff textarea{
  background:var(--adm-surface);border:1px solid var(--adm-border);color:var(--adm-text);
  border-radius:5px;
}
.admin-staff input[type=text]:focus,
.admin-staff input[type=password]:focus,
.admin-staff textarea:focus{outline:none;border-color:var(--adm-accent);box-shadow:0 0 0 3px var(--adm-accent-soft);}
.admin-staff .admin-card{
  background:var(--adm-surface);border:1px solid var(--adm-border);
  border-radius:8px;padding:24px;box-shadow:0 1px 2px rgba(16,24,40,.04);
  max-width:760px;
}
.admin-staff .admin-card h2{color:var(--adm-text);font-size:1.05rem;font-weight:600;margin-bottom:14px;}
.admin-staff button{
  margin-top:16px;background:var(--adm-text);color:#fff;
  border:none;padding:9px 16px;border-radius:6px;font-weight:500;
  letter-spacing:0;text-transform:none;font-size:.85rem;cursor:pointer;
  transition:background .15s;
}
.admin-staff button:hover{background:#000;opacity:1;}
.admin-staff h3{color:var(--adm-text);}

/* ===== SIDEBAR ===== */
.admin-layout{display:flex;min-height:100vh;padding:0;}
.admin-sidebar{
  width:224px;flex-shrink:0;
  background:var(--adm-surface);border-right:1px solid var(--adm-border);
  display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;overflow-y:auto;
}
.admin-sidebar-brand{padding:22px 20px 18px;border-bottom:1px solid var(--adm-border);}
.admin-sidebar-brand-gold{display:block;font-family:'Inter', -apple-system, sans-serif;font-weight:700;color:var(--adm-text);font-size:1.05rem;letter-spacing:.01em;}
.admin-sidebar-brand-sub{display:block;font-size:.62rem;letter-spacing:.28em;color:var(--adm-text-muted);margin-top:3px;}

.admin-nav{padding:14px 10px;flex:1;}
.admin-nav-group{
  font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:#98a0ac;
  padding:14px 12px 6px;
}
.admin-nav-group:first-child{padding-top:2px;}
.admin-nav-link{
  display:flex;align-items:center;gap:10px;
  padding:8px 12px;border-radius:6px;
  color:#42474f;text-decoration:none;font-size:.84rem;
  transition:background .15s,color .15s;
  background:none;border:none;width:100%;text-align:left;cursor:pointer;
  font-family:'Inter', -apple-system, sans-serif;
}
.admin-nav-link svg{flex-shrink:0;width:16px;height:16px;}
.admin-nav-link:hover{background:#f1f2f4;color:var(--adm-text);}
.admin-nav-link-active{background:var(--adm-accent-soft);color:var(--adm-accent);font-weight:600;}

.admin-sidebar-footer{padding:10px;border-top:1px solid var(--adm-border);}
.admin-logout-link{color:var(--adm-danger);}
.admin-logout-link:hover{background:var(--adm-danger-soft);color:var(--adm-danger);}

.admin-main{flex:1;min-width:0;padding:32px 40px 60px;max-width:none;}
.admin-main-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:22px;}
.admin-main-header h1{font-family:'Inter', -apple-system, sans-serif;color:var(--adm-text);font-size:1.4rem;font-weight:600;}
.admin-view-live{color:var(--adm-text-muted);font-size:.82rem;text-decoration:none;}
.admin-view-live:hover{color:var(--adm-accent);}

.admin-section-title{font-family:'Inter', -apple-system, sans-serif;color:var(--adm-text);font-size:.95rem;font-weight:600;margin:6px 0 12px;}

.admin-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:30px;}
.admin-stat-card{background:var(--adm-surface);border:1px solid var(--adm-border);border-radius:8px;padding:18px;box-shadow:0 1px 2px rgba(16,24,40,.04);}
.admin-stat-number{display:block;font-family:'Inter', -apple-system, sans-serif;font-weight:700;color:var(--adm-text);font-size:1.6rem;}
.admin-stat-label{display:block;font-size:.74rem;color:var(--adm-text-muted);margin-top:3px;}

.admin-quicklink-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;}
.admin-quicklink{
  display:flex;align-items:center;gap:13px;
  background:var(--adm-surface);border:1px solid var(--adm-border);border-radius:8px;
  padding:15px;text-decoration:none;color:var(--adm-text);
  transition:border-color .15s,box-shadow .15s;
  box-shadow:0 1px 2px rgba(16,24,40,.04);
}
.admin-quicklink:hover{border-color:var(--adm-accent);box-shadow:0 2px 8px rgba(16,24,40,.08);}
.admin-quicklink-icon{
  width:36px;height:36px;flex-shrink:0;border-radius:8px;
  background:var(--adm-accent-soft);color:var(--adm-accent);
  display:flex;align-items:center;justify-content:center;
}
.admin-quicklink strong{display:block;font-size:.87rem;color:var(--adm-text);font-weight:600;}
.admin-quicklink small{display:block;font-size:.74rem;color:var(--adm-text-muted);margin-top:2px;line-height:1.4;}

.admin-mobile-toggle{
  display:none;
  position:fixed;top:14px;left:14px;z-index:50;
  background:var(--adm-surface);border:1px solid var(--adm-border);color:var(--adm-text);
  width:38px;height:38px;border-radius:8px;cursor:pointer;
  align-items:center;justify-content:center;
  box-shadow:0 2px 6px rgba(16,24,40,.1);
}

@media(max-width:900px){
  .admin-layout{flex-direction:column;}
  .admin-sidebar{
    position:fixed;top:0;left:0;height:100vh;z-index:40;
    transform:translateX(-100%);transition:transform .25s ease;
    box-shadow:20px 0 40px rgba(0,0,0,.2);
  }
  .admin-sidebar-open{transform:translateX(0);}
  .admin-mobile-toggle{display:flex;}
  .admin-main{padding:70px 18px 50px;max-width:none;}
}

.logout-btn{background:none;border:1px solid var(--line);color:var(--cream);padding:8px 16px;border-radius:4px;cursor:pointer;font-size:.82rem;}
.admin-staff .logout-btn{background:var(--adm-surface);border:1px solid var(--adm-border);color:var(--adm-text);padding:7px 13px;border-radius:6px;font-size:.8rem;}
.admin-staff .logout-btn:hover{border-color:var(--adm-accent);color:var(--adm-accent);}

.saved-banner{background:#1c2b1c;border:1px solid #3a5c3a;color:#a5d6a5;padding:12px 18px;border-radius:4px;margin-bottom:24px;font-size:.9rem;}
.admin-staff .saved-banner{background:var(--adm-success-soft);border:1px solid #bfe3cc;color:var(--adm-success);border-radius:6px;}

.cover-preview{
  display:block;width:100%;max-width:280px;height:170px;
  object-fit:cover;object-position:center 20%;
  border-radius:6px;border:1px solid var(--line);margin-bottom:14px;
  background:#0f0c09;
}
.admin-staff .cover-preview{border:1px solid var(--adm-border);border-radius:6px;}

.article-block{border-top:1px dashed var(--line);padding-top:16px;margin-top:16px;}
.admin-staff .article-block{border-top:1px dashed var(--adm-border);}

.login-box{max-width:380px;margin:80px auto;background:var(--charcoal);border:1px solid var(--line);padding:40px;border-radius:6px;position:relative;z-index:2;}
.login-box h1{font-family:'Inter', -apple-system, sans-serif;color:var(--gold);text-align:center;margin-bottom:24px;}
.admin-staff .login-box{background:var(--adm-surface);border:1px solid var(--adm-border);box-shadow:0 4px 24px rgba(16,24,40,.08);}
.admin-staff .login-box h1{color:var(--adm-text);}

.error-msg{background:#2b1c1c;border:1px solid #5c3a3a;color:#e6a5a5;padding:10px 14px;border-radius:4px;font-size:.85rem;margin-bottom:14px;}
.admin-staff .error-msg{background:var(--adm-danger-soft);border:1px solid #f2c6c1;color:var(--adm-danger);border-radius:6px;}

.admin-staff .login-bg{display:none;}

/* ===== ADMIN: LAYOUT PICKER ===== */
.layout-picker{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px;}
.layout-option{cursor:pointer;text-align:center;width:96px;}
.layout-option input{position:absolute;opacity:0;width:0;height:0;}
.layout-preview{
  display:block;width:96px;height:72px;
  border:2px solid var(--adm-border);border-radius:6px;
  overflow:hidden;background:#f8f8fa;
  transition:border-color .2s;
  position:relative;
}
.layout-option input:checked + .layout-preview{border-color:var(--adm-accent);box-shadow:0 0 0 1px var(--adm-accent);}
.layout-option-label{display:block;margin-top:6px;font-size:.72rem;color:var(--adm-text-muted);}

/* full: photo llena todo, barra de texto abajo */
.lp-photo-full{position:absolute;inset:0;background:linear-gradient(160deg,#c9b79a,#8f7c5f);}
.lp-text-bar{position:absolute;left:0;right:0;bottom:0;height:35%;background:rgba(0,0,0,.55);}
.lp-text-bar::before{content:"";position:absolute;left:10%;right:35%;top:30%;height:12%;background:var(--adm-accent);}

/* half: mitad foto, mitad panel de texto */
.lp-half-photo{position:absolute;left:0;top:0;width:50%;height:100%;background:linear-gradient(160deg,#c9b79a,#8f7c5f);}
.lp-half-text{position:absolute;right:0;top:0;width:50%;height:100%;background:#eceef1;}
.lp-half-text::before{content:"";position:absolute;left:15%;right:15%;top:35%;height:10%;background:var(--adm-accent);}
.lp-half-text::after{content:"";position:absolute;left:15%;right:15%;top:55%;height:8%;background:#c7cbd1;}

/* quarter: foto chica, panel de texto grande */
.lp-quarter-photo{position:absolute;left:0;top:0;width:30%;height:100%;background:linear-gradient(160deg,#c9b79a,#8f7c5f);}
.lp-quarter-text{position:absolute;right:0;top:0;width:70%;height:100%;background:#eceef1;}
.lp-quarter-text::before{content:"";position:absolute;left:10%;right:10%;top:20%;height:8%;background:var(--adm-accent);}
.lp-quarter-text::after{content:"";position:absolute;left:10%;right:10%;top:38%;height:45%;background:repeating-linear-gradient(180deg,#c7cbd1 0,#c7cbd1 8%,transparent 8%,transparent 16%);}

/* solo texto */
.lp-text-only{position:absolute;inset:0;background:#eceef1;}
.lp-text-only::before{content:"";position:absolute;left:12%;right:12%;top:15%;height:10%;background:var(--adm-accent);}
.lp-text-only::after{content:"";position:absolute;left:12%;right:12%;top:32%;height:55%;background:repeating-linear-gradient(180deg,#c7cbd1 0,#c7cbd1 6%,transparent 6%,transparent 12%);}

/* foto arriba (mas de la mitad) + texto abajo */
.lp-top-photo{position:absolute;left:0;top:0;width:100%;height:58%;background:linear-gradient(160deg,#c9b79a,#8f7c5f);}
.lp-top-text{position:absolute;left:0;bottom:0;width:100%;height:42%;background:#eceef1;}
.lp-top-text::before{content:"";position:absolute;left:10%;right:10%;top:18%;height:14%;background:var(--adm-accent);}
.lp-top-text::after{content:"";position:absolute;left:10%;right:10%;top:45%;height:40%;background:repeating-linear-gradient(180deg,#c7cbd1 0,#c7cbd1 10%,transparent 10%,transparent 20%);}

/* ===== ADMIN: selector de columnas ===== */
.col-picker{display:flex;gap:10px;margin-top:6px;}
.col-option{cursor:pointer;text-align:center;}
.col-option input{position:absolute;opacity:0;width:0;height:0;}
.col-option-box{
  display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;border:2px solid var(--adm-border);border-radius:6px;
  font-weight:700;color:var(--adm-text-muted);font-size:1.1rem;
}
.col-option input:checked + .col-option-box{border-color:var(--adm-accent);color:var(--adm-accent);background:var(--adm-accent-soft);}
.col-option-label{display:block;margin-top:4px;font-size:.68rem;color:var(--adm-text-muted);}

/* ===== ADMIN: lista de parrafos individuales ===== */
.paragraph-item{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px;}
.paragraph-num{flex-shrink:0;width:28px;padding-top:12px;font-size:.75rem;color:var(--adm-text-muted);text-align:center;}
.paragraph-item textarea{flex:1;}
.paragraph-remove{
  flex-shrink:0;margin-top:8px;width:30px;height:30px;
  background:none;border:1px solid var(--adm-border);border-radius:6px;
  color:var(--adm-danger);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.paragraph-remove:hover{border-color:var(--adm-danger);background:var(--adm-danger-soft);}
.paragraph-remove svg{width:14px;height:14px;}

/* ===== ADMIN: editor con vista previa al lado ===== */
.editor-with-preview{display:flex;gap:28px;align-items:flex-start;}
.editor-form-col{flex:1;min-width:0;}
.editor-preview-col{width:300px;flex-shrink:0;}
.editor-preview-sticky{position:sticky;top:24px;}
.editor-preview-label{
  font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;
  color:var(--adm-text-muted);margin-bottom:8px;
}
.editor-preview-label span{color:var(--adm-accent);text-transform:none;letter-spacing:0;}
.editor-preview-frame{
  width:100%;height:460px;border:1px solid var(--adm-border);border-radius:8px;
  background:#e8e8ea;box-shadow:0 1px 3px rgba(16,24,40,.06);
}
.editor-preview-hint{font-size:.72rem;color:var(--adm-text-muted);margin-top:8px;text-align:center;}

.admin-comment-row{
  display:flex;justify-content:space-between;align-items:flex-start;gap:14px;
  padding:14px 0;border-top:1px solid var(--adm-border);
}
.admin-comment-row:first-of-type{border-top:none;}
.admin-comment-row strong{font-size:.88rem;color:var(--adm-text);}
.admin-comment-date{font-size:.72rem;color:var(--adm-text-muted);margin-left:8px;}
.admin-comment-row p{font-size:.85rem;color:var(--adm-text);margin-top:4px;line-height:1.5;}

@media(max-width:1100px){
  .editor-with-preview{flex-direction:column;}
  .editor-preview-col{width:100%;}
  .editor-preview-sticky{position:static;}
}

/* foto abajo (espejo de "top") */
.lp-bottom-text{position:absolute;left:0;top:0;width:100%;height:42%;background:#eceef1;}
.lp-bottom-text::before{content:"";position:absolute;left:10%;right:10%;top:22%;height:14%;background:var(--adm-accent);}
.lp-bottom-text::after{content:"";position:absolute;left:10%;right:10%;top:55%;height:30%;background:repeating-linear-gradient(180deg,#c7cbd1 0,#c7cbd1 10%,transparent 10%,transparent 20%);}
.lp-bottom-photo{position:absolute;left:0;bottom:0;width:100%;height:58%;background:linear-gradient(160deg,#c9b79a,#8f7c5f);}

/* dos fotos lado a lado */
.lp-duo-photo-a{position:absolute;left:0;top:0;width:49%;height:100%;background:linear-gradient(160deg,#c9b79a,#8f7c5f);}
.lp-duo-photo-b{position:absolute;right:0;top:0;width:49%;height:100%;background:linear-gradient(200deg,#a8917a,#6b5a48);}

/* tres fotos en fila */
.lp-trio-photo-a{position:absolute;left:0;top:0;width:32%;height:100%;background:linear-gradient(160deg,#c9b79a,#8f7c5f);}
.lp-trio-photo-b{position:absolute;left:34%;top:0;width:32%;height:100%;background:linear-gradient(180deg,#b8a488,#7a6852);}
.lp-trio-photo-c{position:absolute;right:0;top:0;width:32%;height:100%;background:linear-gradient(200deg,#a8917a,#6b5a48);}

/* doble pagina: una sola foto ancha con una linea de doblez en el medio */
.lp-spread-photo{position:absolute;inset:0;background:linear-gradient(100deg,#c9b79a 0%,#8f7c5f 50%,#c9b79a 100%);}
.lp-spread-gap{position:absolute;left:50%;top:0;width:2px;height:100%;background:rgba(0,0,0,.35);box-shadow:0 0 4px rgba(0,0,0,.3);}

/* ===== ADMIN: selector de paginas — una sola pagina visible a la vez ===== */
.page-switcher{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px;}
.page-switcher-pill{
  background:var(--adm-surface);border:1px solid var(--adm-border);color:var(--adm-text-muted);
  padding:9px 16px;border-radius:20px;font-size:.82rem;cursor:pointer;margin-top:0;
  transition:border-color .15s,color .15s,background .15s;
}
.page-switcher-pill:hover{border-color:var(--adm-accent);color:var(--adm-text);}
.page-switcher-pill-active{background:var(--adm-text);border-color:var(--adm-text);color:#fff;font-weight:600;}

.section-panel{display:none;max-width:none;}
.section-panel-active{display:block;animation:tab-fade-in .2s ease;}
.section-panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}

/* ===== ADMIN: cuadricula de paginas (lista de Behind the Scenes) ===== */
.page-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;}
.page-grid-card{
  display:block;text-decoration:none;color:var(--adm-text);
  background:var(--adm-surface);border:1px solid var(--adm-border);border-radius:10px;
  overflow:hidden;transition:border-color .15s,box-shadow .15s,transform .15s;
}
.page-grid-card:hover{border-color:var(--adm-accent);box-shadow:0 4px 14px rgba(16,24,40,.08);transform:translateY(-2px);}
.page-grid-thumb{aspect-ratio:3/4;background:#eceef1;overflow:hidden;}
.page-grid-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.page-grid-thumb-empty{width:100%;height:100%;background:linear-gradient(160deg,#e6e6e9,#cfd1d6);}
.page-grid-info{padding:12px 14px;display:flex;flex-direction:column;gap:3px;}
.page-grid-info strong{font-size:.85rem;}
.page-grid-info span{font-size:.76rem;color:var(--adm-text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.page-grid-badge{
  align-self:flex-start;margin-top:4px;font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--adm-accent);background:var(--adm-accent-soft);padding:2px 9px;border-radius:20px;
}
.page-grid-add{margin:0;}
.page-grid-add button{
  width:100%;height:100%;min-height:180px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  background:#fafafa;border:2px dashed var(--adm-border);border-radius:10px;
  color:var(--adm-text-muted);font-size:.82rem;cursor:pointer;margin-top:0;
  transition:border-color .15s,color .15s;
}
.page-grid-add button:hover{border-color:var(--adm-accent);color:var(--adm-accent);}
.section-accordion-badge{
  flex-shrink:0;font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--adm-accent);background:var(--adm-accent-soft);
  padding:3px 10px;border-radius:20px;
}

.login-bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:var(--black);}
.login-bg img{width:100%;height:100%;object-fit:cover;filter:blur(10px) brightness(.55) saturate(1.05);transform:scale(1.08);}
.login-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(11,9,6,.55), rgba(11,9,6,.8));}

/* ===== ADMIN: CLIENTES ===== */
.client-row{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;
  padding:16px 0;border-top:1px dashed var(--line);
}
.admin-staff .client-row{border-top:1px dashed var(--adm-border);}
.client-row:first-of-type{border-top:none;padding-top:0;}
.client-row-name{font-family:'Inter', -apple-system, sans-serif;font-size:1.1rem;color:var(--cream);display:flex;align-items:center;gap:10px;}
.admin-staff .client-row-name{color:var(--adm-text);font-size:1rem;font-weight:600;}
.client-row-meta{font-size:.8rem;color:#a99a87;margin-top:4px;}
.admin-staff .client-row-meta{color:var(--adm-text-muted);}
.status-pill{font-size:.68rem;padding:3px 10px;border-radius:20px;letter-spacing:.04em;text-transform:uppercase;}
.status-pill.active{background:#1c2b1c;color:#a5d6a5;border:1px solid #3a5c3a;}
.status-pill.inactive{background:#2b1c1c;color:#e6a5a5;border:1px solid #5c3a3a;}
.status-pill.pending{background:#2b2416;color:#e0b96a;border:1px solid #5c4a26;}
.status-pill.awaiting{background:#1c2333;color:#9ac0e6;border:1px solid #2c3d5c;}
.admin-staff .status-pill.active{background:var(--adm-success-soft);color:var(--adm-success);border:1px solid #bfe3cc;}
.admin-staff .status-pill.inactive{background:var(--adm-danger-soft);color:var(--adm-danger);border:1px solid #f2c6c1;}
.admin-staff .status-pill.pending{background:#fdf2e0;color:#9a6a15;border:1px solid #f0dbab;}
.admin-staff .status-pill.awaiting{background:#e8f0fc;color:#2f5fa8;border:1px solid #c3d8f5;}
.client-row-actions{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap;}
.reset-details{position:relative;}
.reset-details summary{list-style:none;cursor:pointer;}
.reset-details summary::-webkit-details-marker{display:none;}
.reset-form{
  position:absolute;right:0;top:calc(100% + 6px);z-index:10;
  background:var(--panel);border:1px solid var(--line);border-radius:6px;
  padding:12px;display:flex;gap:8px;min-width:220px;
}
.admin-staff .reset-form{background:var(--adm-surface);border:1px solid var(--adm-border);box-shadow:0 4px 16px rgba(16,24,40,.1);}
.reset-form input{flex:1;background:#0f0c09;border:1px solid var(--line);color:var(--cream);padding:8px 10px;border-radius:4px;font-size:.85rem;}
.admin-staff .reset-form input{background:#fff;border:1px solid var(--adm-border);color:var(--adm-text);}
.reset-form button{background:var(--amber);border:none;color:#160f08;padding:8px 12px;border-radius:4px;font-size:.8rem;cursor:pointer;white-space:nowrap;}
.admin-staff .reset-form button{background:var(--adm-text);color:#fff;margin-top:0;}

.admin-photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px;margin-top:16px;}
.admin-photo-item{position:relative;border-radius:6px;overflow:hidden;border:1px solid var(--line);aspect-ratio:3/4;}
.admin-staff .admin-photo-item{border:1px solid var(--adm-border);}
.admin-photo-item img{width:100%;height:100%;object-fit:cover;display:block;}
.admin-photo-delete{
  position:absolute;top:6px;right:6px;background:rgba(11,9,6,.75);color:#e6a5a5;
  border:1px solid #5c3a3a;border-radius:50%;width:26px;height:26px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.admin-staff .admin-photo-delete{background:rgba(255,255,255,.92);color:var(--adm-danger);border:1px solid var(--adm-border);}
.admin-photo-delete svg{width:13px;height:13px;}

/* ===== PORTAL DE CLIENTE ===== */
.gallery-body{background:var(--black);color:var(--cream);font-family:'Inter', -apple-system, sans-serif;min-height:100vh;position:relative;}

.gallery-bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:var(--black);}
.bg-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(10px) brightness(.5) saturate(1.05);transform:scale(1.08);opacity:0;transition:opacity .7s ease;}
.bg-layer.active{opacity:1;}
.gallery-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(11,9,6,.5), rgba(11,9,6,.72));}

.gallery-head{
  position:relative;z-index:2;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;
  padding:22px 32px;border-bottom:1px solid var(--line);
}
.gallery-brand-title{font-family:'Inter', -apple-system, sans-serif;font-weight:700;color:var(--gold);font-size:1.3rem;letter-spacing:.03em;}
.gallery-brand-sub{font-size:.6rem;letter-spacing:.3em;color:#a99a87;margin-left:8px;}
.gallery-head-actions{display:flex;align-items:center;gap:20px;font-size:.85rem;}
.gallery-head-actions a{color:#cbbda8;}
.gallery-head-actions a:hover{color:var(--gold);}
.gallery-username{color:#a99a87;}
.download-all-btn{
  display:inline-flex;align-items:center;gap:7px;
  background:linear-gradient(120deg,var(--amber),#c9622c);color:#160f08!important;
  padding:9px 18px;border-radius:4px;font-weight:600;text-decoration:none;letter-spacing:.02em;
}
.gallery-logout{background:none;border:1px solid var(--line);color:var(--cream);padding:8px 16px;border-radius:4px;cursor:pointer;font-size:.85rem;}
.gallery-toast{position:relative;z-index:2;max-width:600px;margin:20px auto 0;background:#1c2b1c;border:1px solid #3a5c3a;color:#a5d6a5;padding:12px 18px;border-radius:4px;text-align:center;font-size:.9rem;}

.gallery-main{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:60px 32px 120px;text-align:center;}
.gallery-title{font-family:'Inter', -apple-system, sans-serif;font-size:2.4rem;color:var(--gold);}
.gallery-sub{color:#a99a87;font-size:.9rem;margin:8px 0 60px;}
.gallery-empty{color:#a99a87;font-size:1rem;margin-top:40px;}

/* Abanico */
.fan-gallery{
  display:flex;justify-content:center;align-items:flex-end;
  padding:60px 0 30px;
  flex-wrap:wrap;
  gap:0;
}
.fan-card{
  --n:6;
  width:180px;aspect-ratio:3/4;
  margin-left:-58px;
  border-radius:10px;
  overflow:hidden;
  border:3px solid var(--charcoal);
  box-shadow:0 10px 30px rgba(0,0,0,.55);
  cursor:pointer;
  transform-origin:bottom center;
  transform:rotate(calc(var(--i) * 6deg)) translateY(calc(var(--lift) * 10px));
  transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s, z-index 0s;
  position:relative;
  z-index:calc(100 - (var(--lift) * 10));
  background:var(--charcoal);
}
.fan-card:first-child{margin-left:0;}
.fan-card img{width:100%;height:100%;object-fit:cover;display:block;}
.fan-card:hover{
  transform:rotate(0deg) translateY(-26px) scale(1.08);
  box-shadow:0 22px 50px rgba(232,184,126,.28);
  z-index:50;
}

@media(max-width:820px){
  .fan-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:20px 0;}
  .fan-card{
    margin-left:0;width:100%;
    transform:none!important;
    box-shadow:0 8px 20px rgba(0,0,0,.4);
  }
  .fan-card:hover{transform:scale(1.03)!important;}
  .gallery-head{padding:18px 20px;}
  .gallery-main{padding:40px 20px 80px;}
}

/* Lightbox */
.lightbox{
  position:fixed;inset:0;background:rgba(6,4,2,.94);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transition:opacity .25s;
  z-index:1000;
}
.lightbox.open{opacity:1;pointer-events:auto;}
.lb-img{max-width:88vw;max-height:78vh;border-radius:6px;box-shadow:0 20px 60px rgba(0,0,0,.6);}
.lb-close{position:absolute;top:24px;right:28px;background:none;border:none;color:var(--cream);cursor:pointer;}
.lb-close svg{width:22px;height:22px;}
.lb-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(255,255,255,.08);border:1px solid var(--line);color:var(--cream);
  width:48px;height:48px;border-radius:50%;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
}
.lb-nav svg{width:22px;height:22px;}
.lb-prev{left:24px;} .lb-next{right:24px;}
.lb-download{
  display:inline-flex;align-items:center;gap:8px;
  position:absolute;bottom:30px;left:50%;transform:translateX(-50%);
  background:linear-gradient(120deg,var(--amber),#c9622c);color:#160f08;
  padding:11px 24px;border-radius:4px;text-decoration:none;font-weight:600;font-size:.9rem;
}
@media(max-width:600px){
  .lb-nav{width:38px;height:38px;font-size:1.3rem;}
  .lb-prev{left:10px;} .lb-next{right:10px;}
}

/* ===== ARTICLE PAGE (Behind the Scenes) ===== */
.article-page{background:var(--black);color:var(--cream);}
.article-topbar{
  position:fixed;top:0;left:0;right:0;z-index:50;
  height:70px;box-sizing:border-box;
  display:flex;justify-content:space-between;align-items:center;
  padding:0 32px;
  background:rgba(11,9,6,.88);
  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  border-bottom:1px solid rgba(232,184,126,.15);
}
.article-topbar-right{
  display:flex;align-items:center;gap:10px;
}
@media(max-width:600px){
  .article-topbar-right{gap:6px;}
}
.article-back{
  display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;
  border:1px solid rgba(232,184,126,.35);border-radius:50%;
  background:rgba(11,9,6,.4);
  backdrop-filter:blur(3px);
  color:var(--gold);text-decoration:none;
  transition:border-color .2s,background .2s;
}
.article-back:hover{border-color:var(--gold);background:rgba(11,9,6,.6);opacity:1;}

.article-hero{position:relative;height:56vh;min-height:340px;overflow:hidden;}
.article-hero img{width:100%;height:100%;object-fit:cover;object-position:50% 15%;}
.article-hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(11,9,6,.15) 0%, rgba(11,9,6,.85) 100%);
}
.article-hero-text{
  position:absolute;left:0;right:0;bottom:0;
  padding:40px 32px;max-width:900px;margin:0 auto;
}
.article-kicker{color:var(--amber);letter-spacing:.15em;text-transform:uppercase;font-size:.8rem;margin-bottom:8px;}
.article-title{font-family:'Inter', -apple-system, sans-serif;font-size:clamp(2.2rem,5vw,3.4rem);color:var(--cream);font-weight:700;}

/* ===== Magazine masthead for Behind the Scenes ===== */
.article-masthead{max-width:720px;margin:20px auto 10px;padding:0 32px;text-align:center;}
.article-title-page{font-family:'Inter', -apple-system, sans-serif;font-weight:700;font-size:clamp(2.2rem,5vw,3.2rem);color:var(--gold);margin:6px 0 20px;}
.article-rule{width:64px;height:2px;background:var(--amber);margin:0 auto;}

.fullscreen-toggle{
  display:inline-flex;align-items:center;gap:7px;
  margin-top:18px;background:none;border:1px solid var(--line);color:#cbbda8;
  padding:8px 16px;border-radius:20px;font-size:.8rem;cursor:pointer;
  transition:border-color .2s,color .2s;
}
.fullscreen-toggle:hover{border-color:var(--gold);color:var(--gold);}
.fullscreen-exit{
  display:none;align-items:center;gap:6px;
  position:absolute;top:14px;right:14px;z-index:10;
  background:rgba(11,9,6,.6);border:1px solid var(--line);color:var(--cream);
  padding:8px 14px;border-radius:20px;font-size:.8rem;cursor:pointer;
}

.reader-fullscreen{
  position:fixed;inset:0;z-index:2000;
  background:var(--black);
  display:flex;flex-direction:column;justify-content:center;
  padding:20px;overflow-y:auto;
  max-width:none;
}
.reader-fullscreen .fullscreen-exit{display:inline-flex;}
.reader-fullscreen .flipbook-holder{width:100%;max-width:1100px;margin:0 auto;}
.reader-fullscreen .spread-nav{max-width:1100px;margin:24px auto 0;}
body.reader-fullscreen-lock{overflow:hidden;}

@media(max-width:760px){
  .reader-fullscreen{padding:0;justify-content:flex-start;}
  .reader-fullscreen .spread-wrap{padding:0;}
  .reader-fullscreen .flipbook-holder{max-width:none;padding:0;}
  .reader-fullscreen .fullscreen-exit{top:calc(env(safe-area-inset-top, 0px) + 14px);}
}

/* ===== Magazine reader (PageFlip) ===== */
.reader-stage{
  position:fixed;
  top:70px;left:0;right:0;bottom:56px;
  overflow:hidden;
  background:var(--black);
}
.spread-wrap{max-width:1400px;margin:0 auto;padding:20px 24px 40px;}
.magazine-backdrop{
  position:absolute;inset:0;z-index:0;overflow:hidden;
}
.backdrop-single{
  width:100%;height:100%;object-fit:cover;object-position:center 20%;
  filter:blur(6px) brightness(.38) saturate(.85);
  transform:scale(1.1);
}
.backdrop-overlay{position:absolute;inset:0;background:radial-gradient(ellipse at center, rgba(11,9,6,.35) 0%, rgba(11,9,6,.75) 100%);}

.flipbook-holder{
  width:100%;height:100%;
  position:relative;z-index:2;
  display:flex;align-items:center;justify-content:center;
  padding:0;
}
#flipbook{margin:0 auto;}

.page{
  background:var(--charcoal);overflow:hidden;
  border-radius:3px;
  box-shadow:
    0 25px 60px rgba(0,0,0,.5),
    7px 8px 0 -2px var(--panel), 7px 8px 0 -1.5px rgba(0,0,0,.35),
    14px 15px 0 -4px var(--charcoal), 14px 15px 0 -3.5px rgba(0,0,0,.3),
    -3px 0 8px rgba(0,0,0,.25);
}
.page-inner{position:relative;width:100%;height:100%;overflow:hidden;container-type:inline-size;}
.page-layout-spread .page-inner{background-repeat:no-repeat;background-color:var(--charcoal);}
.page-inner img,.page-inner video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0%;}
.page-media-empty{position:absolute;inset:0;background:linear-gradient(160deg,var(--charcoal),var(--panel));}

.page-cover .cover-vignette{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(11,9,6,.7) 0%, rgba(11,9,6,.1) 30%, rgba(11,9,6,.1) 55%, rgba(11,9,6,.8) 100%),
    linear-gradient(90deg, rgba(11,9,6,.4) 0%, transparent 40%, transparent 60%, rgba(11,9,6,.4) 100%);
}
.page-cover-content{
  position:absolute;inset:0;z-index:2;
  display:flex;flex-direction:column;justify-content:space-between;
  padding:20px 22px;
}
.page-cover-top{display:flex;justify-content:space-between;align-items:flex-start;}
.page-cover-right{display:flex;flex-direction:column;gap:10px;text-align:right;max-width:52%;}
.page-cover-issue{font-size:clamp(9px, 2.24cqw, 14px);letter-spacing:.1em;color:#cbbda8;text-transform:uppercase;}
.page-cover-right .coverline-title{font-size:clamp(13px, 4.01cqw, 21px);line-height:1.2;font-weight:600;}
.page-cover-right .coverline-body{font-size:clamp(11px, 2.6cqw, 15px);line-height:1.35;margin-top:2px;}
.page-cover .wordmark-title{font-size:clamp(31px, 10.03cqw, 54px);line-height:.85;}
.page-cover .wordmark-sub{font-size:clamp(9px, 2.48cqw, 13px);letter-spacing:.28em;margin-top:2px;}
.page-cover .kicker{font-size:clamp(14px, 4.48cqw, 24px);}
.page-cover .headline{font-size:clamp(28px, 9.44cqw, 52px);margin:2px 0 0;}
.page-cover .subhead div{font-size:clamp(12px, 3.42cqw, 18px);letter-spacing:.02em;line-height:1.35;}

.page-overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg, transparent 0%, rgba(11,9,6,.35) 40%, rgba(11,9,6,.95) 88%);
}

/* ===== Layouts alternativos de pagina (half / quarter / text) — paneles en blanco, nunca sobre la foto ===== */
.page-layout-half .page-inner,
.page-layout-quarter .page-inner{
  display:flex;width:100%;height:100%;
}
.page-split-media{position:relative;overflow:hidden;background:var(--charcoal);}
.page-split-media img,.page-split-media video{width:100%;height:100%;object-fit:cover;object-position:50% 15%;display:block;}
.page-layout-half .page-split-media{width:50%;}
.page-layout-half .page-split-text{width:50%;}
.page-layout-quarter .page-split-media{width:32%;}
.page-layout-quarter .page-split-text{width:68%;}
.page-split-text{
  background:#ffffff;
  padding:6cqw 5cqw 9cqw;
  overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-start;
  container-type:inline-size;
}
.page-text-columns-split{column-count:2;column-gap:5cqw;}

.page-text-full{
  width:100%;height:100%;
  background:#ffffff;
  padding:6cqw 6cqw 9cqw;
  overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-start;
  container-type:inline-size;
}
.page-layout-text .page-text-columns{column-count:3;column-gap:16px;}

/* ===== 2 o 3 fotos en la misma pagina ===== */
.page-duo{position:absolute;inset:0;display:flex;gap:2px;background:var(--black);}
.page-duo-photo{position:relative;flex:1;overflow:hidden;}
.page-duo-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block;}

/* ===== NUEVA PLANTILLA: foto arriba (o abajo) + texto en blanco ===== */
.page-layout-top .page-inner,
.page-layout-bottom .page-inner{display:flex;flex-direction:column;width:100%;height:100%;}
.page-top-media{position:relative;overflow:hidden;height:56%;background:var(--charcoal);}
.page-top-media img,.page-top-media video{width:100%;height:100%;object-fit:cover;object-position:50% 15%;display:block;}
.page-top-text{
  height:44%;background:#ffffff;
  padding:5cqw 5cqw 8cqw;overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-start;
  container-type:inline-size;
}

@media(max-width:760px){
  .page-layout-top .page-top-media,
  .page-layout-bottom .page-top-media{height:48%;}
  .page-layout-top .page-top-text,
  .page-layout-bottom .page-top-text{height:52%;}
}

/* Texto DENTRO de los paneles blancos (half / quarter / text-only / top / bottom) — gris oscuro */
.page-split-text .page-num,
.page-text-full .page-num,
.page-top-text .page-num{
  display:block;font-size:clamp(9px, 2.01cqw, 13px);color:#9a9a9a;letter-spacing:.15em;margin-bottom:8px;text-transform:uppercase;
}
.page-split-text h2,
.page-text-full h2,
.page-top-text h2{
  font-family:'Inter', -apple-system, sans-serif;font-weight:700;color:#232323;
  font-size:clamp(14px, 2.48cqw, 19px);margin-bottom:8px;
  overflow-wrap:break-word;word-break:break-word;
  max-width:100%;
}
.page-split-text p,
.page-text-full p,
.page-top-text p{
  color:#454545;font-size:clamp(12px, 2.36cqw, 15px);line-height:1.5;margin-bottom:10px;
  text-align:justify;hyphens:auto;
  overflow-wrap:break-word;word-break:break-word;max-width:100%;
}
.page-split-text p:first-of-type::first-letter,
.page-text-full p:first-of-type::first-letter,
.page-top-text p:first-of-type::first-letter{
  font-family:'Inter', -apple-system, sans-serif;
  font-weight:700;
  font-size:clamp(21px, 6.84cqw, 35px);
  line-height:.75;
  float:left;
  color:#232323;
  margin:1px 4px 0 0;
}
.page-top-text .page-text-columns{column-count:2;column-gap:5cqw;}

@media(max-width:760px){
  .page-layout-half .page-inner,
  .page-layout-quarter .page-inner{flex-direction:column;}
  .page-layout-half .page-split-media,
  .page-layout-half .page-split-text,
  .page-layout-quarter .page-split-media,
  .page-layout-quarter .page-split-text{width:100%;}
  .page-layout-half .page-split-media{height:40%;}
  .page-layout-half .page-split-text{height:60%;}
  .page-layout-quarter .page-split-media{height:25%;}
  .page-layout-quarter .page-split-text{height:75%;}
  .page-text-columns-split{column-count:1;}
}

/* Texto SOBRE la foto completa (layout "full") */
.page-text{
  position:absolute;left:0;right:0;bottom:0;
  padding:20px 24px 58px;
  max-height:46%;
  overflow:hidden;
}
.page-text .page-text-columns{
  column-count:3;
  column-gap:16px;
}
.page-num{
  display:block;font-size:clamp(9px, 2.01cqw, 13px);color:rgba(255,255,255,.5);letter-spacing:.15em;margin-bottom:8px;text-transform:uppercase;
}
.page-text h2{
  font-family:'Inter', -apple-system, sans-serif;font-weight:700;color:var(--gold);
  font-size:clamp(14px, 2.48cqw, 19px);margin-bottom:8px;
  overflow-wrap:break-word;word-break:break-word;
  max-width:100%;
}
.page-text p{
  color:#e9ddc9;font-size:clamp(12px, 2.36cqw, 15px);line-height:1.5;margin-bottom:10px;
  text-align:justify;hyphens:auto;
  overflow-wrap:break-word;word-break:break-word;max-width:100%;
}
.page-text p:first-of-type::first-letter{
  font-family:'Inter', -apple-system, sans-serif;
  font-weight:700;
  font-size:clamp(21px, 6.84cqw, 35px);
  line-height:.75;
  float:left;
  color:var(--gold);
  margin:1px 4px 0 0;
}
.page-text p:last-child{margin-bottom:0;}

@media(max-width:760px){
  .flipbook-holder{max-width:100%;}
  #flipbook{width:100%!important;}
  .page-text{
    padding:14px 16px 30px;
    max-height:44%;
    overflow:hidden;
  }
  .page-text .page-text-columns{column-count:3;column-gap:8px;}
}

.article-body{max-width:720px;margin:0 auto;padding:60px 32px 40px;}
.article-body p{color:#d9cdb9;font-size:1.05rem;line-height:1.85;margin-bottom:24px;}
.article-cta{
  display:inline-flex;align-items:center;gap:8px;
  color:var(--amber);text-decoration:none;font-weight:600;letter-spacing:.03em;
  border-bottom:1px solid var(--amber);padding-bottom:4px;margin-top:10px;
}
.article-cta:hover{opacity:.8;}

.spread-nav{
  position:absolute;left:50%;bottom:44px;
  transform:translateX(-50%);
  z-index:10;
  display:flex;align-items:center;gap:10px;
  background:rgba(17,14,10,.68);
  border:1px solid rgba(232,184,126,.22);
  border-radius:999px;
  padding:8px 10px 8px 8px;
  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  box-shadow:0 14px 34px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06);
}
.spread-nav-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  color:var(--cream);
  cursor:pointer;font-size:.8rem;letter-spacing:.04em;font-weight:600;
  transition:background .2s,border-color .2s,color .2s,transform .15s,box-shadow .2s;
}
#spreadPrev{width:38px;height:38px;border-radius:50%;padding:0;}
#spreadPrev:hover:not(:disabled){background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);transform:scale(1.06);}
#spreadNext{
  width:52px;height:52px;padding:0;border-radius:50%;
  background:linear-gradient(120deg,var(--amber),#c9622c);
  border:1px solid rgba(255,255,255,.15);
  color:#160f08;
  box-shadow:0 6px 18px rgba(224,161,60,.35);
}
#spreadNext svg{width:24px;height:24px;}
#spreadNext:hover{transform:scale(1.06);box-shadow:0 8px 22px rgba(224,161,60,.5);}
.spread-nav-btn:disabled{opacity:.3;cursor:default;transform:none!important;box-shadow:none!important;}
.spread-nav-btn svg{width:15px;height:15px;flex-shrink:0;}
.spread-nav-btn-hide{visibility:hidden;}
.spread-dots{display:flex;align-items:center;gap:6px;padding:0 2px;}
.spread-dot{
  width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.28);border:none;cursor:pointer;padding:0;
  transition:background .25s,width .25s,transform .2s;
}
.spread-dot:hover{background:rgba(255,255,255,.55);}
.spread-dot-active{background:var(--amber);width:18px;border-radius:4px;box-shadow:0 0 10px rgba(224,161,60,.6);}

@media(max-width:600px){
  .spread-nav{gap:5px;padding:5px 6px 5px 5px;max-width:calc(100vw - 24px);}
  #spreadPrev{width:30px;height:30px;flex-shrink:0;}
  #spreadNext{height:30px;padding:0 12px;font-size:0;gap:0;}
  #spreadNext svg{width:14px;height:14px;}
  .spread-nav-btn svg{width:13px;height:13px;}
  .spread-dots{gap:4px;padding:0;}
  .spread-dot{width:5px;height:5px;}
  .spread-dot-active{width:14px;}
}

@media(max-width:480px){
  .spread-nav{gap:4px;padding:4px 5px;bottom:32px;}
  #spreadPrev{width:28px;height:28px;}
  #spreadNext{height:28px;padding:0 10px;}
}

.booking-box{
  margin-top:56px;
  border:1px solid var(--line);
  border-radius:8px;
  padding:40px 32px;
  text-align:center;
  background:linear-gradient(160deg,var(--charcoal),var(--panel));
}
.booking-box h2{font-family:'Inter', -apple-system, sans-serif;font-size:1.5rem;color:var(--gold);margin-bottom:10px;}
.booking-box p{color:#cfc4b5;font-size:.95rem;max-width:480px;margin:0 auto 26px;}
.booking-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;}
.btn-primary-lg{
  display:inline-flex;align-items:center;gap:9px;
  background:linear-gradient(120deg,var(--amber),#c9622c);color:#160f08;
  padding:14px 26px;border-radius:4px;text-decoration:none;font-weight:600;letter-spacing:.02em;font-size:.9rem;
}
.btn-ghost-lg{
  display:inline-flex;align-items:center;gap:9px;
  border:1px solid var(--line);color:var(--cream);
  padding:14px 26px;border-radius:4px;text-decoration:none;letter-spacing:.02em;font-size:.9rem;
}
.btn-primary-lg:hover{opacity:.9;}
.btn-ghost-lg:hover{border-color:var(--gold);color:var(--gold);}

.booking-box-floating{
  position:absolute;right:24px;top:50%;
  transform:translateY(-50%);
  z-index:8;
  max-width:280px;
  margin-top:0;
  text-align:left;
  background:rgba(11,9,6,.6);
  backdrop-filter:blur(6px);
  border:1px solid rgba(232,184,126,.25);
  padding:22px 24px;
}
.booking-box-floating h2{font-size:1.1rem;}
.booking-box-floating p{font-size:.82rem;margin:0 0 16px;max-width:none;}
.booking-box-floating .booking-actions{flex-direction:column;align-items:stretch;gap:8px;}
.booking-box-floating .btn-primary-lg,
.booking-box-floating .btn-ghost-lg{padding:10px 14px;font-size:.78rem;justify-content:center;}

@media(max-width:760px){
  .booking-box-floating{
    left:16px;right:16px;top:20px;bottom:auto;transform:none;max-width:none;
    padding:14px 16px;
  }
  .booking-box-floating p{display:none;}
  .booking-box-floating h2{font-size:.9rem;margin-bottom:10px;}
  .booking-box-floating .booking-actions{flex-direction:row;}
}

/* ===== QR SHARE ===== */
.qr-trigger{
  position:absolute;
  bottom:26px;left:50%;
  transform:translateX(-50%);
  z-index:3;
  display:inline-flex;align-items:center;gap:14px;
  background:rgba(11,9,6,.45);
  border:1px solid rgba(232,184,126,.35);
  border-radius:10px;
  padding:13px 22px;cursor:pointer;color:var(--cream);
  backdrop-filter:blur(4px);
  transition:border-color .2s,transform .2s,background .2s;
}
.qr-trigger:hover{border-color:var(--gold);background:rgba(11,9,6,.65);transform:translateX(-50%) translateY(-2px);}
.qr-trigger-icon{color:var(--gold);flex-shrink:0;}
.qr-trigger-icon svg{width:26px;height:26px;}
.qr-trigger-text{display:flex;flex-direction:column;align-items:flex-start;text-align:left;}
.qr-trigger-title{font-weight:700;letter-spacing:.02em;font-size:.9rem;}
.qr-trigger-sub{font-size:.74rem;color:#e9ddc9;margin-top:2px;}

@media(max-width:600px){
  .qr-trigger{bottom:18px;padding:11px 18px;gap:10px;}
  .qr-trigger-icon svg{width:22px;height:22px;}
}

.qr-modal-overlay{
  position:fixed;inset:0;z-index:1000;
  background:rgba(6,4,2,0);
  display:flex;align-items:flex-end;justify-content:center;
  pointer-events:none;
  transition:background .35s ease;
}
.qr-modal-overlay.open{background:rgba(6,4,2,.7);pointer-events:auto;}

.qr-modal{
  position:relative;
  width:100%;max-width:440px;
  background:var(--charcoal);
  border:1px solid var(--line);
  border-bottom:none;
  border-radius:18px 18px 0 0;
  padding:14px 32px 36px;
  text-align:center;
  transform:translateY(100%);
  transition:transform .4s cubic-bezier(.2,.8,.2,1);
}
.qr-modal-overlay.open .qr-modal{transform:translateY(0);}

.qr-modal-handle{width:44px;height:4px;border-radius:3px;background:var(--line);margin:0 auto 18px;}
.qr-modal-close{
  position:absolute;top:16px;right:16px;background:none;border:none;color:#a99a87;cursor:pointer;
}
.qr-modal-close svg{width:20px;height:20px;}
.qr-modal-title{font-family:'Inter', -apple-system, sans-serif;font-size:1.3rem;color:var(--gold);}
.qr-modal-sub{font-size:.8rem;color:#a99a87;margin-bottom:20px;}

.qr-code-box{
  display:inline-block;padding:14px;background:var(--cream);border-radius:10px;margin-bottom:22px;
  line-height:0;
}

.qr-link-row{display:flex;gap:8px;margin-bottom:22px;}
.qr-link-row input{
  flex:1;background:#0f0c09;border:1px solid var(--line);color:var(--cream);
  padding:11px 14px;border-radius:6px;font-size:.82rem;
}
.qr-link-row button{
  background:linear-gradient(120deg,var(--amber),#c9622c);color:#160f08;border:none;
  padding:0 18px;border-radius:6px;font-weight:600;font-size:.82rem;cursor:pointer;white-space:nowrap;
}

.qr-share-row{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;}
.qr-share-btn{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid var(--line);color:var(--cream);text-decoration:none;
  padding:10px 16px;border-radius:6px;font-size:.85rem;
}
.qr-share-btn svg{width:16px;height:16px;}
.qr-share-btn:hover{border-color:var(--gold);color:var(--gold);}

@media(max-width:480px){
  .qr-modal{padding:14px 20px 30px;}
  .qr-share-row{gap:8px;}
  .qr-share-btn{padding:9px 12px;font-size:.8rem;}
}

/* ===== ABOUT US — editorial layout ===== */
.editorial-wrap{max-width:980px;margin:0 auto;padding:44px 32px 40px;}
.editorial-kicker{color:var(--amber);letter-spacing:.2em;text-transform:uppercase;font-size:.78rem;text-align:center;margin-bottom:36px;}

.editorial-layout{display:grid;grid-template-columns:38% 1fr;gap:48px;align-items:start;}
.editorial-media{margin:0;}
.editorial-media img{
  width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;
  border-radius:8px;border:1px solid var(--line);
  box-shadow:0 24px 60px rgba(0,0,0,.45);
  filter:grayscale(1) contrast(1.05);
}
.editorial-media figcaption{
  margin-top:10px;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  color:#6b5c48;text-align:center;
}

.editorial-copy{padding-top:4px;}
.editorial-dropcap{color:#d9cdb9;font-size:1.05rem;line-height:1.85;margin-bottom:22px;}
.editorial-dropcap::first-letter{
  font-family:'Inter', -apple-system, sans-serif;
  font-weight:700;
  font-size:4.2rem;
  line-height:.75;
  float:left;
  color:var(--gold);
  margin:6px 10px 0 0;
}
.editorial-pullquote{
  border-left:3px solid var(--amber);
  margin:30px 0;padding:4px 0 4px 22px;
  font-family:'Inter', -apple-system, sans-serif;
  font-style:italic;font-weight:700;
  font-size:1.3rem;line-height:1.5;
  color:var(--gold);
}
.editorial-copy p{color:#d9cdb9;font-size:1.02rem;line-height:1.85;margin-bottom:20px;}
.editorial-copy p:last-child{margin-bottom:0;}

@media(max-width:820px){
  .editorial-layout{grid-template-columns:1fr;gap:28px;}
  .editorial-media img{aspect-ratio:3/2;max-width:340px;margin:0 auto;display:block;}
  .editorial-media figcaption{max-width:340px;margin-left:auto;margin-right:auto;}
  .editorial-wrap{padding:36px 20px 30px;}
  .editorial-dropcap::first-letter{font-size:3.2rem;}
  .editorial-pullquote{font-size:1.1rem;}
}

/* ===== BOOKING PAGE ===== */
.booking-main{max-width:560px;margin:0 auto;padding:50px 32px 80px;text-align:center;}
.booking-title{font-family:'Inter', -apple-system, sans-serif;font-weight:700;font-size:clamp(2rem,5vw,2.8rem);color:var(--gold);margin:6px 0 14px;}
.booking-intro{color:#cfc4b5;font-size:.98rem;margin-bottom:36px;}

.booking-form{text-align:left;background:var(--charcoal);border:1px solid var(--line);border-radius:10px;padding:32px;}
.booking-form label{display:block;font-size:.78rem;letter-spacing:.04em;color:#cbbda8;margin:16px 0 6px;text-transform:uppercase;}
.booking-form label:first-child{margin-top:0;}
.booking-form input,.booking-form select,.booking-form textarea{
  width:100%;background:#0f0c09;border:1px solid var(--line);color:var(--cream);
  padding:11px 14px;border-radius:4px;font-family:'Inter', -apple-system, sans-serif;font-size:.95rem;
}
.booking-form textarea{min-height:90px;resize:vertical;}
.booking-form button{
  margin-top:26px;width:100%;background:linear-gradient(120deg,var(--amber),#c9622c);
  color:#160f08;border:none;padding:15px 26px;border-radius:4px;font-weight:600;
  letter-spacing:.03em;text-transform:uppercase;font-size:.9rem;cursor:pointer;
}
.booking-form button:hover{opacity:.92;}

.booking-success{
  background:var(--charcoal);border:1px solid #3a5c3a;border-radius:10px;
  padding:44px 32px;color:#a5d6a5;
}
.booking-success svg{color:#a5d6a5;margin-bottom:12px;}
.booking-success h2{font-family:'Inter', -apple-system, sans-serif;color:var(--cream);margin-bottom:10px;}
.booking-success p{color:#cfc4b5;font-size:.95rem;}

/* ===== ADMIN: BOOKINGS ===== */
.booking-row{
  display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:14px;
  padding:18px 0;border-top:1px dashed var(--line);
}
.booking-row:first-of-type{border-top:none;padding-top:0;}
.booking-row-info{flex:1;min-width:220px;}
.booking-contact{font-size:.85rem;color:#cbbda8;margin-top:6px;}
.booking-contact a{color:#cbbda8;}
.booking-contact a:hover{color:var(--gold);}
.booking-notes{font-size:.85rem;color:#a99a87;margin-top:8px;max-width:480px;font-style:italic;}

@media(max-width:820px){
  .article-topbar{padding:18px 20px;}
  .article-masthead{padding:0 20px;}
  .article-body{padding:40px 20px 30px;}
}

/* ===== ADMIN: BOOKING CALENDAR ===== */
.booking-cal-header{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:14px;}
.booking-cal-title{font-weight:600;color:var(--adm-text);font-size:1rem;min-width:150px;text-align:center;}
.booking-cal-nav{
  background:none;border:1px solid var(--adm-border);color:var(--adm-text);
  width:32px;height:32px;border-radius:6px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;margin-top:0;
}
.booking-cal-nav:hover{border-color:var(--adm-accent);color:var(--adm-accent);}
.booking-cal-weekdays{
  display:grid;grid-template-columns:repeat(7,1fr);
  font-size:.7rem;color:var(--adm-text-muted);text-align:center;margin-bottom:6px;
}
.booking-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;}
.booking-cal-day{
  aspect-ratio:1/1;min-height:52px;
  border:1px solid var(--adm-border);border-radius:6px;
  padding:6px;font-size:.78rem;color:var(--adm-text);
  display:flex;flex-direction:column;gap:4px;
}
.booking-cal-day-empty{border:none;}
.booking-cal-today{border-color:var(--adm-accent);background:var(--adm-accent-soft);}
.booking-cal-dots{display:flex;gap:3px;flex-wrap:wrap;}
.booking-cal .dot{width:6px;height:6px;border-radius:50%;display:inline-block;}
.dot-pending{background:#c9922f;}
.dot-approved{background:#2f7a4d;}
.dot-denied{background:#b3382c;}
.dot-awaiting{background:#2f5fa8;}
.booking-cal-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;font-size:.78rem;color:var(--adm-text-muted);}
.booking-cal-legend span{display:flex;align-items:center;gap:6px;}
.booking-cal-day-has-bookings:hover{border-color:var(--adm-accent);background:var(--adm-accent-soft);}

.cal-filter-banner{
  background:var(--adm-accent-soft);border:1px solid #e6cfa0;color:#8a5c15;
  padding:10px 16px;border-radius:6px;margin-bottom:18px;font-size:.85rem;
}
.cal-filter-banner button{
  margin:0;background:none;border:none;color:#8a5c15;text-decoration:underline;
  cursor:pointer;padding:0;font-size:.85rem;text-transform:none;letter-spacing:0;font-weight:600;
}

@media(max-width:600px){
  .booking-cal-day{min-height:40px;font-size:.68rem;padding:4px;}
}

/* ===== CLIENTE: ELEGIR FECHA SUGERIDA ===== */
.date-choice-form{max-width:420px;margin:0 auto;text-align:left;}
.date-choice{display:block;cursor:pointer;margin-bottom:10px;}
.date-choice input{position:absolute;opacity:0;width:0;height:0;}
.date-choice-box{
  display:flex;align-items:center;gap:10px;
  border:1px solid var(--line);border-radius:8px;
  padding:14px 16px;color:var(--cream);font-size:.95rem;
  transition:border-color .2s,background .2s;
}
.date-choice input:checked + .date-choice-box{border-color:var(--amber);background:rgba(232,184,126,.08);color:var(--gold);}
.date-choice-form button{
  width:100%;margin-top:10px;background:linear-gradient(120deg,var(--amber),#c9622c);
  color:#160f08;border:none;padding:15px;border-radius:6px;font-weight:600;
  letter-spacing:.03em;text-transform:uppercase;font-size:.9rem;cursor:pointer;
}

/* ===== LIKES Y COMENTARIOS ===== */
.page-engagement{
  display:flex;gap:6px;visibility:hidden;
}
.engagement-btn{
  display:flex;align-items:center;gap:4px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.18);border-radius:16px;
  padding:7px 11px;color:#f4ece0;font-size:.7rem;cursor:pointer;
  transition:background .2s,border-color .2s;
}
.engagement-btn:hover{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.1);}
.engagement-btn svg{width:13px;height:13px;flex-shrink:0;}
.like-btn .heart-icon{fill:none;stroke:#f4ece0;transition:fill .2s,stroke .2s,transform .2s;}
.like-btn-active .heart-icon{fill:#e0526b;stroke:#e0526b;}
.like-btn-pop .heart-icon{animation:heart-pop .35s ease;}
.music-btn-active{border-color:rgba(232,184,126,.5);background:rgba(232,184,126,.12);color:var(--gold);}
.music-icon-note,.music-icon-pause{width:13px;height:13px;}

.music-prompt{
  display:none;
  position:absolute;top:78px;left:50%;
  transform:translateX(-50%) translateY(-12px);
  z-index:20;
  align-items:center;gap:14px;
  background:rgba(17,14,10,.82);backdrop-filter:blur(14px) saturate(140%);
  border:1px solid rgba(232,184,126,.28);
  border-radius:16px;
  padding:12px 16px;
  box-shadow:0 14px 34px rgba(0,0,0,.4);
  opacity:0;
  transition:opacity .3s ease,transform .3s ease;
  max-width:min(90vw,380px);
}
.music-prompt-show{opacity:1;transform:translateX(-50%) translateY(0);}
.music-prompt span{color:var(--cream);font-size:.82rem;white-space:normal;}
.music-prompt-actions{display:flex;gap:8px;flex-shrink:0;}
.music-prompt-actions button{
  margin-top:0;border:none;border-radius:10px;padding:7px 16px;
  font-size:.78rem;font-weight:700;cursor:pointer;letter-spacing:.02em;
}
#musicPromptYes{background:linear-gradient(120deg,var(--amber),#c9622c);color:#160f08;}
#musicPromptYes:hover{opacity:.9;}
#musicPromptNo{background:rgba(255,255,255,.08);color:var(--cream);border:1px solid rgba(255,255,255,.15);}
#musicPromptNo:hover{background:rgba(255,255,255,.14);}

@media(max-width:600px){
  .music-prompt{
    top:auto;bottom:20px;left:16px;right:16px;transform:translateY(12px);
    max-width:none;flex-direction:column;align-items:stretch;text-align:center;
  }
  .music-prompt-show{transform:translateY(0);}
  .music-prompt-actions{justify-content:center;}
}
@keyframes heart-pop{
  0%{transform:scale(1);}
  40%{transform:scale(1.35);}
  100%{transform:scale(1);}
}

/* ===== MODAL DE COMENTARIOS — panel elegante que baja desde arriba ===== */
.comments-modal{
  position:fixed;inset:0;z-index:200;
  display:none;align-items:flex-start;justify-content:center;
  padding:0;
}
.comments-modal-open{display:flex;}
.comments-modal-backdrop{
  position:absolute;inset:0;background:rgba(8,6,4,.55);backdrop-filter:blur(4px);
  opacity:0;transition:opacity .35s ease;
}
.comments-modal-show .comments-modal-backdrop{opacity:1;}
.comments-modal-box{
  position:relative;z-index:1;
  width:100%;max-width:460px;max-height:min(78vh,620px);
  margin-top:0;
  background:linear-gradient(180deg, rgba(23,19,16,.92), rgba(15,12,9,.94));
  backdrop-filter:blur(22px) saturate(1.3);
  -webkit-backdrop-filter:blur(22px) saturate(1.3);
  border:1px solid rgba(232,184,126,.22);
  border-top:none;
  border-radius:0 0 24px 24px;
  padding:26px 28px 24px;display:flex;flex-direction:column;
  box-shadow:0 30px 70px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06);
  transform:translateY(-100%);
  transition:transform .45s cubic-bezier(.19,1,.22,1);
}
.comments-modal-show .comments-modal-box{transform:translateY(0);}
.comments-modal-handle{
  width:40px;height:4px;border-radius:999px;background:rgba(232,184,126,.35);
  margin:0 auto 18px;
}
.comments-modal-close{
  position:absolute;top:18px;right:20px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:var(--cream);cursor:pointer;
  width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s,border-color .15s;
}
.comments-modal-close:hover{background:rgba(255,255,255,.12);border-color:rgba(232,184,126,.4);color:var(--gold);}
.comments-modal-title{
  font-family:'Inter', -apple-system, sans-serif;font-weight:700;color:var(--gold);
  font-size:1.15rem;margin-bottom:18px;letter-spacing:.01em;
}
.comments-list{overflow-y:auto;flex:1;margin-bottom:18px;max-height:280px;}
.comments-empty{color:#a99a87;font-size:.85rem;}
.comment-item{display:flex;gap:12px;padding:14px 2px;border-bottom:1px solid rgba(255,255,255,.06);transition:background .15s;}
.comment-item:last-child{border-bottom:none;}
.comment-item:hover{background:rgba(255,255,255,.03);}
.comment-avatar{
  flex-shrink:0;width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-weight:700;font-size:.75rem;
  box-shadow:0 2px 8px rgba(0,0,0,.3);
}
.comment-body{flex:1;min-width:0;}
.comment-head{display:flex;align-items:baseline;gap:8px;margin-bottom:3px;}
.comment-head strong{color:var(--gold);font-size:.85rem;font-weight:700;}
.comment-time{color:#8a7c68;font-size:.68rem;}
.comment-item p{color:#e9ddc9;font-size:.87rem;line-height:1.55;word-wrap:break-word;}
.comment-form{display:flex;flex-direction:column;gap:10px;border-top:1px solid rgba(255,255,255,.08);padding-top:18px;}
.comment-form input,
.comment-form textarea{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);color:var(--cream);
  padding:11px 14px;border-radius:10px;font-family:'Inter', -apple-system, sans-serif;font-size:.88rem;
}
.comment-form input::placeholder,
.comment-form textarea::placeholder{color:#8a7c68;}
.comment-form textarea{min-height:70px;resize:vertical;}
.comment-form input:focus,
.comment-form textarea:focus{outline:none;border-color:var(--amber);background:rgba(255,255,255,.08);}
.comment-form button{
  background:linear-gradient(120deg,var(--amber),#c9622c);color:#160f08;border:none;
  padding:12px;border-radius:10px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;
  font-size:.82rem;cursor:pointer;box-shadow:0 4px 14px rgba(224,161,60,.35);
}
.comment-form button:hover{opacity:.92;}

@media(max-width:600px){
  .engagement-btn{padding:6px 9px;font-size:.62rem;}
  .engagement-btn svg{width:11px;height:11px;}
  .comments-modal-box{padding:24px;border-radius:16px;}
}

/* ===== PORTADA: sin scroll, pie de pagina fijo abajo, como una app ===== */
body.home-page{
  height:100vh;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  margin:0;
}
body.home-page .cover{
  flex:1;
  min-height:0;
  overflow:hidden;
}
body.home-page .site-foot{
  flex-shrink:0;
}

/* ===== PIE DE PAGINA CON ICONOS (portada) ===== */
.foot-icon-row{display:flex;gap:20px;align-items:center;}
.foot-icon-row a{
  color:#a99a87;display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:50%;
  border:1px solid transparent;
  transition:color .2s,border-color .2s,background .2s;
}
.foot-icon-row a:hover{color:var(--gold);border-color:rgba(232,184,126,.3);background:rgba(232,184,126,.08);}
.foot-icon-row svg{width:17px;height:17px;}

/* ===== Boton "abrir revista" mas claro ===== */
.extra-magazine-cta{
  border:1px solid rgba(232,184,126,.35);
  border-radius:14px;
  padding:12px 18px;
  background:rgba(232,184,126,.05);
}
.mag-book-icon svg{width:22px;height:22px;}
.mag-cta-badge{
  margin-top:6px;
  font-size:.72rem;
  color:var(--gold);
  letter-spacing:.03em;
  display:flex;align-items:center;gap:4px;
}
.mag-cta-arrow{display:inline-block;animation:mag-arrow-nudge 1.3s ease-in-out infinite;}
@keyframes mag-arrow-nudge{
  0%,100%{transform:translateX(0);}
  50%{transform:translateX(4px);}
}




/* ===== APP-STYLE: barra de abajo vacia + bloqueo de scroll ===== */
.reader-bottombar{
  position:fixed;bottom:0;left:0;right:0;z-index:50;
  height:56px;
  background:rgba(11,9,6,.88);
  backdrop-filter:blur(16px) saturate(150%);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  border-top:1px solid rgba(232,184,126,.15);
}
body.article-page{
  overflow:hidden;
  margin:0;
}