/* Guía Legal — Vidal Navarro Abogados Asociados (vnabogados.cl/blog/) · 25-09-2026 */
:root{
  --paper:#F2ECDF; --paper-2:#EAE2D0; --ink:#201B15; --ink-soft:#55493A;
  --gold:#B08D3E; --gold-dk:#8A6D2C; --dark:#171411; --dark-2:#1E1A16; --ivory:#F0E9DB;
  --hairline:rgba(138,109,44,.35);
  --serif:"Cormorant Garamond", Georgia, "Times New Roman", serif;
  --body:"Lora", Georgia, serif;
}
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ background:var(--paper); color:var(--ink); font-family:var(--body); -webkit-font-smoothing:antialiased; overflow-x:hidden; }
::selection{ background:rgba(176,141,62,.3); }
a{ color:inherit; text-decoration:none; }
a:focus-visible, button:focus-visible{ outline:2px solid var(--gold-dk); outline-offset:3px; }
.wrap{ max-width:1120px; margin:0 auto; padding-left:1.5rem; padding-right:1.5rem; }
.grain{
  position:fixed; inset:0; z-index:4; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.9'/%3E%3C/svg%3E");
}

/* ---------- Navegación ---------- */
.nav{ position:sticky; top:0; z-index:20; background:rgba(242,236,223,.96); box-shadow:0 1px 0 var(--hairline); backdrop-filter:blur(6px); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding-top:1.1rem; padding-bottom:1.1rem; }
.brand{ display:flex; align-items:center; gap:.9rem; }
.brand-mono{ font-family:var(--serif); font-weight:600; font-size:1.8rem; line-height:1; letter-spacing:.04em; transform:translateY(-2px); }
.brand-sep{ width:1px; height:34px; background:var(--hairline); }
.brand-text{ display:flex; flex-direction:column; gap:.22rem; }
.brand-name{ font-size:.72rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; }
.brand-desc{ font-size:.55rem; letter-spacing:.32em; text-transform:uppercase; color:var(--gold-dk); }
.nav-links{ display:flex; align-items:center; gap:2rem; list-style:none; }
.nav-links a{ font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); transition:color .2s; }
.nav-links a:hover, .nav-links a.on{ color:var(--gold-dk); }
.nav-links .tel{ color:var(--ink); font-weight:600; }
@media (max-width:980px){ .nav-links{ gap:1.4rem; } }
@media (max-width:820px){
  .nav-links li{ display:none; }
  .nav-links li:last-child, .nav-links li:nth-last-child(2){ display:block; }
  .nav-links{ gap:1.2rem; }
}
@media (max-width:520px){
  .brand-name{ font-size:.64rem; }
  .brand-mono{ font-size:1.5rem; }
  .nav-links li:nth-last-child(2){ display:none; }
  .nav-links .tel{ white-space:nowrap; letter-spacing:.08em; }
  .brand-desc{ letter-spacing:.2em; }
}

/* ---------- Encabezados ---------- */
.crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:.35rem .6rem; margin-bottom:2rem; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-soft); }
.crumbs a{ border-bottom:1px solid transparent; transition:color .2s, border-color .2s; }
.crumbs a:hover{ color:var(--gold-dk); border-color:var(--hairline); }
.crumbs .sep{ color:var(--gold); }
.kicker{ display:flex; align-items:center; gap:.9rem; margin-bottom:1.2rem; }
.kicker-rule{ width:38px; height:1px; background:var(--gold); flex:none; }
.kicker span{ font-size:.68rem; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-dk); }
.accent{ font-style:italic; color:var(--gold-dk); }
.a-head, .g-head{ background:var(--paper-2); border-bottom:1px solid var(--hairline); }
.a-head{ padding:2.6rem 0 2.6rem; }
.a-head h1{ font-family:var(--serif); font-weight:500; font-size:clamp(2.05rem, 4.2vw, 3.15rem); line-height:1.12; max-width:30ch; }
.a-meta{ display:flex; flex-wrap:wrap; gap:.4rem 0; margin-top:1.4rem; font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); }
.a-meta span + span::before{ content:"·"; color:var(--gold-dk); margin:0 .8rem; }
.g-head{ padding:2.6rem 0 3rem; }
.g-head h1{ font-family:var(--serif); font-weight:500; font-size:clamp(2.5rem, 5.2vw, 3.8rem); line-height:1.08; }
.g-intro{ margin-top:1.2rem; max-width:62ch; font-size:1.02rem; line-height:1.85; color:var(--ink-soft); }
.chips{ list-style:none; display:flex; flex-wrap:wrap; gap:.6rem; margin-top:2rem; }
.chips a{ display:inline-flex; align-items:baseline; gap:.45rem; padding:.55rem 1.05rem; border:1px solid var(--hairline); border-radius:999px; background:var(--paper); font-size:.82rem; color:var(--ink); transition:border-color .2s, color .2s; }
.chips a:hover{ border-color:var(--gold); color:var(--gold-dk); }
.chips b{ font-family:var(--serif); font-style:italic; font-weight:600; font-size:1rem; color:var(--gold-dk); }

/* ---------- Artículo ---------- */
.a-grid{ display:grid; grid-template-columns:minmax(0,1fr); gap:3rem; padding-top:3rem; padding-bottom:4.5rem; }
@media (min-width:1000px){ .a-grid{ grid-template-columns:minmax(0,680px) 290px; justify-content:space-between; gap:3.5rem; } }
.a-main{ min-width:0; max-width:680px; }
.prose .lede{ font-size:1.14rem; line-height:1.85; color:var(--ink); margin-bottom:1.6rem; }
.prose p{ font-size:1.02rem; line-height:1.9; color:var(--ink-soft); margin-bottom:1.15rem; }
.prose h2{ font-family:var(--serif); font-weight:600; font-size:clamp(1.55rem, 2.6vw, 1.95rem); line-height:1.2; color:var(--ink); margin:2.6rem 0 .9rem; scroll-margin-top:96px; }
.prose h3{ font-family:var(--serif); font-weight:600; font-size:1.3rem; line-height:1.3; margin:1.8rem 0 .6rem; }
.prose strong{ color:var(--ink); font-weight:600; }
.prose a{ color:var(--gold-dk); border-bottom:1px solid rgba(138,109,44,.45); transition:color .2s, border-color .2s; }
.prose a:hover{ color:var(--ink); border-color:var(--gold-dk); }
.prose ul, .prose ol{ list-style:none; margin:0 0 1.4rem; }
.prose li{ position:relative; padding-left:1.7rem; margin-bottom:.75rem; font-size:1.02rem; line-height:1.8; color:var(--ink-soft); }
.prose ul li::before{ content:""; position:absolute; left:.3rem; top:.74em; width:6px; height:6px; background:var(--gold); transform:rotate(45deg); }
.prose ol{ counter-reset:paso; }
.prose ol li{ counter-increment:paso; padding-left:2.2rem; }
.prose ol li::before{ content:counter(paso) "."; position:absolute; left:0; top:-.12em; font-family:var(--serif); font-style:italic; font-weight:600; font-size:1.35rem; font-variant-numeric:lining-nums; color:var(--gold-dk); }

.cta-box{ position:relative; margin:3rem 0 1.8rem; padding:2.3rem 2.2rem 2.2rem; background:var(--dark); color:var(--ivory); border-radius:3px; box-shadow:0 26px 50px -30px rgba(23,20,17,.7); }
.cta-box::before{ content:""; position:absolute; left:2.2rem; top:0; width:56px; height:2px; background:var(--gold); }
.cta-box h2{ font-family:var(--serif); font-weight:500; font-size:clamp(1.6rem, 2.8vw, 2rem); line-height:1.2; margin-bottom:.8rem; }
.cta-box p{ color:#CFC5B4; font-size:.98rem; line-height:1.8; }
.cta-box strong{ color:var(--ivory); font-weight:600; }
.cta-box .cta-note{ margin-top:1rem; color:var(--gold); font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; }
.cta-actions{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.4rem; }
.autor{ display:flex; gap:1rem; align-items:center; margin:0 0 1.6rem; padding:1.1rem 1.2rem; background:var(--paper-2); border:1px solid var(--hairline); border-radius:3px; }
.autor img{ flex:none; width:72px; height:72px; border-radius:50%; object-fit:cover; border:1px solid var(--hairline); }
.autor-rol{ font-size:.62rem; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-dk); }
.autor-nombre{ margin-top:.2rem; font-family:var(--serif); font-weight:600; font-size:1.25rem; line-height:1.2; }
.autor-desc{ margin-top:.25rem; font-size:.84rem; line-height:1.6; color:var(--ink-soft); }
.aviso{ padding-top:1.2rem; border-top:1px solid var(--hairline); font-size:.84rem; font-style:italic; line-height:1.7; color:var(--ink-soft); }

.a-side{ display:none; }
@media (min-width:1000px){
  .a-side{ display:block; }
  .side-sticky{ position:sticky; top:104px; display:flex; flex-direction:column; gap:1.4rem; }
}
.side-card{ background:var(--paper-2); border:1px solid var(--hairline); border-radius:3px; padding:1.4rem 1.4rem 1.5rem; }
.side-title{ margin-bottom:.8rem; font-size:.64rem; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-dk); }
.toc ol{ list-style:none; counter-reset:toc; }
.toc li{ counter-increment:toc; display:flex; gap:.55rem; padding:.5rem 0; border-bottom:1px dotted rgba(32,27,21,.22); font-size:.84rem; line-height:1.5; }
.toc li:last-child{ border-bottom:none; padding-bottom:0; }
.toc li::before{ content:counter(toc, upper-roman) "."; flex:none; min-width:1.9rem; font-family:var(--serif); font-style:italic; font-weight:600; font-size:.98rem; line-height:1.35; color:var(--gold-dk); }
.toc a{ color:var(--ink-soft); transition:color .2s; }
.toc a:hover{ color:var(--gold-dk); }
.side-help h3{ font-family:var(--serif); font-weight:600; font-size:1.35rem; line-height:1.25; margin-bottom:.55rem; }
.side-help p{ font-size:.86rem; line-height:1.7; color:var(--ink-soft); margin-bottom:1.1rem; }
.side-help .btn{ width:100%; justify-content:center; }
.side-tel{ display:block; margin-top:.8rem; text-align:center; font-size:.8rem; color:var(--ink); border-bottom:1px solid transparent; transition:color .2s; }
.side-tel:hover{ color:var(--gold-dk); }

/* ---------- Tarjetas ---------- */
.rel{ padding:4rem 0 4.4rem; background:var(--paper-2); border-top:1px solid var(--hairline); }
.rel-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:1.2rem 2rem; flex-wrap:wrap; margin-bottom:2rem; }
.rel h2{ font-family:var(--serif); font-weight:500; font-size:clamp(1.75rem, 3.2vw, 2.4rem); line-height:1.15; }
.guide-link{ font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-dk); border-bottom:1px solid var(--hairline); padding-bottom:.3rem; transition:color .2s, border-color .2s; white-space:nowrap; }
.guide-link:hover{ color:var(--ink); border-color:var(--gold-dk); }
.guide-grid{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:1.2rem; }
@media (max-width:900px){ .guide-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:580px){ .guide-grid{ grid-template-columns:minmax(0,1fr); } }
.chapter{ display:flex; flex-direction:column; gap:.7rem; background:var(--paper); border:1px solid var(--hairline); border-radius:3px; padding:1.5rem 1.4rem; transition:transform .25s, border-color .25s, box-shadow .25s; }
.chapter:hover{ transform:translateY(-3px); border-color:var(--gold); box-shadow:0 10px 26px rgba(32,27,21,.08); }
.chapter-eyebrow{ font-size:.62rem; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-dk); }
.chapter h3{ font-family:var(--serif); font-weight:600; font-size:1.28rem; line-height:1.3; }
.chapter p{ flex:1; font-size:.88rem; line-height:1.7; color:var(--ink-soft); }
.chapter-more{ margin-top:auto; padding-top:.3rem; font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); transition:color .2s; }
.chapter:hover .chapter-more{ color:var(--gold-dk); }

/* ---------- Índice de la guía ---------- */
.cat{ padding:3.6rem 0 3.8rem; scroll-margin-top:72px; }
.cat-alt{ background:var(--paper-2); border-top:1px solid var(--hairline); border-bottom:1px solid var(--hairline); }
.cat-head{ display:flex; align-items:baseline; gap:.9rem; margin-bottom:1.8rem; }
.cat-num{ flex:none; font-family:var(--serif); font-style:italic; font-weight:600; font-size:1.55rem; color:var(--gold-dk); }
.cat h2{ font-family:var(--serif); font-weight:500; font-size:clamp(1.75rem, 3.2vw, 2.4rem); line-height:1.15; }
.cat-alt .chapter{ background:var(--paper); }

/* ---------- Banda de contacto ---------- */
.band{ padding:4.2rem 0; background:var(--dark); color:var(--ivory); }
.band-inner{ display:grid; grid-template-columns:minmax(0,1.2fr) auto; gap:2.5rem; align-items:center; }
@media (max-width:820px){ .band-inner{ grid-template-columns:minmax(0,1fr); gap:1.8rem; } }
.band .kicker span{ color:var(--gold); }
.band h2{ font-family:var(--serif); font-weight:500; font-size:clamp(1.85rem, 3.4vw, 2.6rem); line-height:1.15; }
.band h2 .accent{ color:var(--gold); }
.band p{ margin-top:.9rem; max-width:52ch; font-size:.95rem; line-height:1.8; color:#A79C8B; }
.band-actions{ display:flex; flex-wrap:wrap; gap:.8rem; }

/* ---------- Botones ---------- */
.btn{ display:inline-flex; align-items:center; gap:.55rem; padding:.95rem 1.6rem; border-radius:3px; border:1px solid transparent; font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; transition:background .2s, color .2s, border-color .2s; }
.btn .ic{ width:1.1em; height:1.1em; fill:currentColor; flex:none; }
.btn-gold{ background:var(--gold); color:#171411; border-color:var(--gold); }
.btn-gold:hover{ background:#D6B36B; border-color:#D6B36B; }
.btn-line{ border-color:rgba(240,233,219,.35); color:var(--ivory); }
.btn-line:hover{ border-color:var(--gold); color:var(--gold); }

/* ---------- Pie ---------- */
footer{ background:var(--dark-2); color:#A79C8B; border-top:1px solid rgba(176,141,62,.25); }
.foot-inner{ display:flex; justify-content:space-between; align-items:center; gap:1.5rem; flex-wrap:wrap; padding-top:2rem; padding-bottom:2rem; font-size:.78rem; line-height:1.7; }
footer .brand-name, footer .brand-mono{ color:var(--ivory); }
footer .brand-desc{ color:var(--gold); }

/* ---------- Celulares ---------- */
@media (max-width:640px){
  .a-head{ padding:1.8rem 0 2rem; }
  .g-head{ padding:1.8rem 0 2.4rem; }
  .crumbs{ margin-bottom:1.5rem; }
  .a-meta{ flex-direction:column; gap:.45rem; letter-spacing:.1em; }
  .a-meta span + span::before{ content:none; }
  .chips{ gap:.45rem; margin-top:1.6rem; }
  .chips a{ padding:.45rem .9rem; font-size:.78rem; }
  .a-grid{ padding-top:2.2rem; padding-bottom:3.4rem; }
  .prose .lede{ font-size:1.06rem; }
  .prose p, .prose li{ font-size:.98rem; }
  .cta-box{ padding:2rem 1.4rem 1.6rem; }
  .cta-box::before{ left:1.4rem; }
  .cat{ padding:2.8rem 0 3rem; }
  .rel{ padding:3.2rem 0 3.4rem; }
  .band{ padding:3.4rem 0; }
}
@media (max-width:520px){
  .cta-actions .btn, .band-actions .btn{ flex:1 1 100%; justify-content:center; }
}