/* MON STUDIO · páginas legales
   Layout: plató oscuro y silencioso; índice fijo a la izquierda, texto a 68 caracteres. Prioridad: lectura. */
:root{
  --black:#1D1C1C; --ink-2:#232222; --gold:#B9914D; --gold-deep:#8F6B2F; --gold-light:#DCC38F;
  --ivory:#F7F3EA; --text:#E9E3D6; --stone-light:#A8A196; --line:rgba(247,243,234,.12);
  --f-display:"Quicksand","Arial Rounded MT Bold",Arial,sans-serif;
  --f-body:"Nunito Sans",Arial,Helvetica,sans-serif;
  --f-accent:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --gutter:max(16px, env(safe-area-inset-left, 0px)); --gutter-r:max(16px, env(safe-area-inset-right, 0px));
  --ease:cubic-bezier(.22,1,.36,1);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--black);color:var(--text);font-family:var(--f-body);font-size:1.0625rem;line-height:1.75;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--gold-light);text-underline-offset:3px}
a:hover{color:var(--ivory)}
:focus-visible{outline:2px solid var(--gold-light);outline-offset:3px;border-radius:4px}
::selection{background:var(--gold);color:var(--black)}
.wrap{padding-left:var(--gutter);padding-right:var(--gutter-r)}
.skip{position:absolute;left:16px;top:-60px;z-index:200;background:var(--gold);color:var(--black);padding:10px 16px;border-radius:999px;font-family:var(--f-display);font-weight:700;text-decoration:none}
.skip:focus{top:16px}

.grain{position:fixed;inset:-50%;z-index:1;pointer-events:none;opacity:.035;background-size:180px;animation:grain 1s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-5%,4%)}50%{transform:translate(4%,-6%)}75%{transform:translate(-7%,2%)}100%{transform:translate(0,0)}}

/* Header */
.lnav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;padding-top:14px;padding-bottom:10px;background:linear-gradient(var(--black) 72%,rgba(29,28,28,0))}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--black)}
.lnav__bar{max-width:1180px;margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 8px 8px 16px;border-radius:999px;background:rgba(29,28,28,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--f-display);font-weight:600;font-size:1.1rem;color:var(--ivory)}
.brand img{height:30px;width:auto}
.back{display:inline-flex;align-items:center;gap:.6em;padding:.7em 1.15em;border-radius:999px;font-family:var(--f-display);font-weight:700;font-size:.9rem;color:var(--ivory);text-decoration:none;box-shadow:inset 0 0 0 1.5px var(--gold);transition:background .3s,color .3s}
.back:hover{background:var(--gold);color:var(--black)}
.back i{width:.55em;height:.62em;background:currentColor;clip-path:polygon(100% 0,0 50%,100% 100%)}

/* Hero */
.lhero{position:relative;z-index:2;max-width:1180px;margin-inline:auto;padding-block:clamp(48px,8vw,96px) clamp(28px,4vw,44px);display:grid;gap:18px}
.label{font-family:var(--f-display);font-weight:600;font-size:.8rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);display:inline-flex;align-items:center;gap:.9em}
.label::before{content:"";width:2.2em;height:1px;background:currentColor}
.lhero h1{margin:0;font-family:var(--f-display);font-weight:700;font-size:clamp(2.3rem,1.4rem + 4vw,4.6rem);line-height:1.04;letter-spacing:-.015em;color:var(--ivory);text-wrap:balance}
.lhero__sub{margin:0;font-family:var(--f-accent);font-style:italic;font-weight:500;font-size:clamp(1.3rem,1.1rem + .8vw,1.75rem);line-height:1.3;color:var(--gold-light)}
.lhero__meta{margin:0;font-size:.92rem;color:var(--stone-light)}
.lhero__arc{position:absolute;right:0;top:clamp(30px,5vw,60px);width:clamp(90px,14vw,170px);height:auto;opacity:.9;pointer-events:none}
.lhero__arc path.arc{stroke-dasharray:420;stroke-dashoffset:420;animation:draw 1.8s var(--ease) .2s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.reveal{animation:rise .9s var(--ease) both}
.reveal:nth-child(2){animation-delay:.08s}.reveal:nth-child(3){animation-delay:.16s}.reveal:nth-child(4){animation-delay:.24s}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

/* Tabs between legal pages */
.tabs{position:relative;z-index:2;max-width:1180px;margin-inline:auto;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;width:max-content}
.tabs a{display:block;padding:12px 14px;font-family:var(--f-display);font-weight:600;font-size:.95rem;color:var(--stone-light);text-decoration:none;border-bottom:2px solid transparent;white-space:nowrap;transition:color .3s,border-color .3s}
.tabs a:hover{color:var(--ivory)}
.tabs a[aria-current="page"]{color:var(--ivory);border-bottom-color:var(--gold)}

/* Body */
.lbody{position:relative;z-index:2;max-width:1180px;margin-inline:auto;padding-block:clamp(36px,5vw,64px) clamp(70px,9vw,120px);display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(32px,6vw,90px);align-items:start}
.toc{position:sticky;top:100px;font-size:.92rem}
.toc details{border:0}
.toc summary{list-style:none;font-family:var(--f-display);font-weight:600;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;cursor:default}
.toc summary::-webkit-details-marker{display:none}
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;counter-reset:t}
.toc a{display:block;padding:6px 0 6px 14px;border-left:1px solid var(--line);color:var(--stone-light);text-decoration:none;line-height:1.4;transition:color .3s,border-color .3s}
.toc a:hover,.toc a.is-active{color:var(--ivory);border-left-color:var(--gold)}

.doc{max-width:68ch;min-width:0}
.notice{margin:0 0 40px;padding:16px 18px;border-radius:14px;border:1px dashed rgba(185,145,77,.6);background:rgba(185,145,77,.07);font-size:.95rem;color:var(--text)}
.notice strong{font-family:var(--f-display);color:var(--gold-light)}
.doc section{padding-block:8px 28px}
.doc section+section{border-top:1px solid var(--line);padding-top:30px}
.doc h2{margin:0 0 14px;font-family:var(--f-display);font-weight:700;font-size:clamp(1.3rem,1.15rem + .6vw,1.65rem);line-height:1.25;color:var(--ivory);display:flex;gap:.55em;align-items:baseline;text-wrap:balance}
.doc h2 .n{font-family:var(--f-accent);font-style:italic;font-weight:500;color:var(--gold);font-size:1.15em;font-variant-numeric:tabular-nums;min-width:1.4em}
.doc h3{margin:22px 0 8px;font-family:var(--f-display);font-weight:700;font-size:1.1rem;color:var(--ivory)}
.doc p{margin:0 0 14px}
.doc ul{margin:0 0 16px;padding:0;list-style:none;display:grid;gap:8px}
.doc ul li{position:relative;padding-left:22px}
.doc ul li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:10px;background:var(--gold);clip-path:polygon(0 0,100% 50%,0 100%)}
.doc strong{color:var(--ivory);font-weight:700}
.pending{display:inline;padding:1px 6px;border-radius:6px;border:1px dashed var(--gold);background:rgba(185,145,77,.12);color:var(--gold-light);font-weight:600;font-size:.95em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.table-wrap{overflow-x:auto;margin:6px 0 18px;border:1px solid var(--line);border-radius:12px}
table{width:100%;border-collapse:collapse;font-size:.93rem;line-height:1.5;min-width:640px}
th,td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--line)}
th{font-family:var(--f-display);font-weight:700;color:var(--gold-light);background:#181717;font-size:.85rem;letter-spacing:.04em}
tr:last-child td{border-bottom:0}
td code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em;color:var(--ivory);background:rgba(247,243,234,.07);padding:1px 6px;border-radius:5px}
.btn{display:inline-flex;align-items:center;gap:.7em;padding:.85em 1.4em;border-radius:999px;border:0;background:var(--gold);color:var(--black);font-family:var(--f-display);font-weight:700;font-size:.95rem;cursor:pointer;text-decoration:none;transition:background .3s}
.btn:hover{background:var(--gold-light);color:var(--black)}
.btn i{width:.6em;height:.68em;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}
.doc .lead-out{margin-top:26px;font-family:var(--f-accent);font-style:italic;font-size:1.3rem;color:var(--gold-light)}

@media (max-width:900px){
  .lbody{grid-template-columns:1fr;gap:24px}
  .toc{position:static;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
  .toc summary{cursor:pointer;margin:0;display:flex;justify-content:space-between;align-items:center}
  .toc summary::after{content:"";width:9px;height:10px;background:var(--gold);clip-path:polygon(0 0,100% 50%,0 100%);transition:transform .3s}
  .toc details[open] summary::after{transform:rotate(90deg)}
  .toc details[open] summary{margin-bottom:12px}
  .lhero__arc{display:none}
}
@media (max-width:480px){ .back span{display:none} .back{padding:.75em .95em} }
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .grain,.reveal,.lhero__arc path.arc{animation:none}
  .lhero__arc path.arc{stroke-dashoffset:0}
}
