/* =========================================================
   AISIN STUDIO · PÁGINAS (títulos de vista, About, legales, age gate)
========================================================= */
/* ---------- OTHER VIEWS ---------- */
#viewHead{position:relative;z-index:1}
.view-title{font:400 40px/1.05 var(--f-display);letter-spacing:.01em;text-transform:uppercase;margin:0 0 8px}
.view-sub{color:var(--muted);margin-bottom:24px;font-size:15px;max-width:60ch;line-height:1.5}
.view-sub:empty{display:none}
.about{position:relative;z-index:1;max-width:720px;font-size:15px;line-height:1.7;color:var(--text-2)}
.about p+p{margin-top:12px}
.about strong{color:var(--text);font-weight:600}
.about .kata{font:400 18px/1.4 var(--f-body);color:var(--red);letter-spacing:.3em;margin:4px 0 16px}
.ab-lead{font-size:17px;line-height:1.6;color:var(--text)}
.ab-sec{margin-top:40px;padding-top:24px;border-top:1px solid var(--line-soft)}
.ab-h{font:400 24px/1.1 var(--f-display);letter-spacing:.01em;text-transform:uppercase;color:var(--text);margin-bottom:16px}
.ab-tiers{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}
.ab-tiers li{display:flex;justify-content:space-between;align-items:center;gap:8px;height:var(--h-lg);padding:0 16px;
  background:var(--surface-1);border:1px solid var(--line);border-left:3px solid var(--c);border-radius:var(--r)}
.ab-tiers .t-pure{--c:var(--pure)}.ab-tiers .t-desire{--c:var(--desire)}.ab-tiers .t-forbidden{--c:var(--forbidden)}
.ab-tiers b{font:600 17px/1 var(--f-cond);letter-spacing:var(--ls-ui);text-transform:uppercase;color:var(--c)}
.ab-tiers span{font:600 13px/1 var(--f-cond);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--muted)}
.ab-code{display:inline-grid;grid-template-columns:auto auto auto auto;align-items:start;column-gap:16px;margin:16px 0 20px;padding:20px 28px;
  background:var(--surface-1);border:1px solid var(--line);border-radius:var(--r-lg)}
.ab-code > div{display:flex;flex-direction:column;align-items:center;gap:10px}
.ab-code b{font:400 44px/1 var(--f-display);color:var(--text);letter-spacing:.02em;padding:0 4px 10px;border-bottom:2px solid var(--red);align-self:stretch;text-align:center}
.ab-code .sep{font:400 44px/1 var(--f-display);color:var(--muted)}
.ab-code span{font:600 12px/1 var(--f-cond);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--muted);white-space:nowrap}
.ab-example{margin-top:16px;padding:16px 20px;background:var(--surface-1);border:1px solid var(--line);border-left:3px solid var(--red);border-radius:var(--r)}
.ab-ex-label{display:block;font:600 12px/1 var(--f-cond);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.ab-example b{display:block;font:400 30px/1 var(--f-display);text-transform:uppercase;color:var(--text);letter-spacing:.01em}
.ab-ex-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px 16px;margin-top:8px;font:600 14px/1.2 var(--f-cond);letter-spacing:var(--ls-ui);text-transform:uppercase}
.ab-ex-row span:first-child{color:var(--red)}
.ab-ex-row span:nth-child(2){color:var(--text-2)}
.ab-ex-row code{margin-left:auto;font:inherit;color:var(--text);font-variant-numeric:tabular-nums}
.ab-tag{margin-top:16px!important;font:400 22px/1.2 var(--f-display);letter-spacing:.01em;text-transform:uppercase;color:var(--red)}
.ab-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
@media (max-width:760px){
  .ab-tiers{grid-template-columns:1fr}
  .ab-code{display:grid;padding:16px 12px;column-gap:8px}
  .ab-code b,.ab-code .sep{font-size:34px}
  .ab-code span{font-size:11px;letter-spacing:.06em}
  .ab-links .btn{flex:1}
}

/* ---------- AGE GATE ---------- */
html.gate-open,html.gate-open body{overflow:hidden}
.age-gate{
  position:fixed;inset:0;z-index:100;display:flex;overflow-y:auto;
  padding:calc(24px + env(safe-area-inset-top,0px)) 16px calc(24px + env(safe-area-inset-bottom,0px));
  background:rgba(0,0,0,.97);animation:gateIn .4s ease both;
}
.age-gate.closing{opacity:0;transition:opacity .4s ease}
@keyframes gateIn{from{opacity:0}to{opacity:1}}
@keyframes gateRise{from{transform:translateY(12px)}to{transform:none}}
.gate-box{
  width:min(520px,100%);margin:auto;text-align:center;padding:32px;
  background:var(--surface-1);border:1px solid var(--line);border-top:2px solid var(--red);border-radius:var(--r-lg);
  animation:gateRise .45s ease both;
}
.gate-logo{display:block;width:min(220px,60vw);height:auto;margin:0 auto 24px}
.gate-title{font:400 36px/1.05 var(--f-display);letter-spacing:.01em;text-transform:uppercase;color:var(--text)}
.gate-title span{color:var(--red)}
.gate-text{color:var(--text-2);font-size:15px;line-height:1.6;margin:12px auto 24px;max-width:44ch}
.gate-check{
  display:flex;gap:12px;align-items:flex-start;text-align:left;padding:14px 16px;cursor:pointer;
  border:1px solid var(--line);background:var(--black);border-radius:var(--r);font-size:14px;line-height:1.5;color:var(--text);transition:border-color .15s;
}
.gate-check:hover{border-color:var(--line-strong)}
.gate-check:has(input:checked){border-color:var(--red)}
.gate-check input{
  appearance:none;-webkit-appearance:none;flex:none;width:18px;height:18px;margin-top:2px;cursor:pointer;
  border:1px solid var(--line-strong);border-radius:var(--r-sm);background:var(--black);display:grid;place-items:center;transition:background-color .15s,border-color .15s;
}
.gate-check input:checked{background:var(--red);border-color:var(--red)}
.gate-check input:checked::after{content:"";width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.gate-enter{width:100%;margin-top:16px}
.gate-disc{margin-top:24px;padding-top:20px;border-top:1px solid var(--line-soft);font-size:12px;line-height:1.6;color:var(--muted)}
.gate-disc p+p{margin-top:8px}
.gate-warn{margin-top:16px;font:600 14px/1.4 var(--f-cond);letter-spacing:.05em;text-transform:uppercase;color:var(--red)}


/* ---------- ADDED: legal pages ---------- */
.legal{position:relative;z-index:1;max-width:760px;font-size:15px;line-height:1.7;color:var(--text-2)}
.legal .updated{margin-bottom:24px;font-size:13px;color:var(--muted)}
.legal h2{margin:32px 0 10px;padding-top:24px;border-top:1px solid var(--line-soft);font:400 22px/1.15 var(--f-display);letter-spacing:.01em;text-transform:uppercase;color:var(--text)}
.legal p{margin-bottom:12px}
.legal ul{margin:0 0 12px 20px}
.legal li{margin-bottom:6px}
.legal strong{color:var(--text);font-weight:600}
.legal a{color:var(--red)}
.ph{color:var(--desire);font-weight:500}   /* placeholder text to replace before publishing */
.gate-disc a{color:var(--text-2);text-decoration:underline;text-underline-offset:2px}
.gate-disc a:hover{color:var(--text)}
