/* Estilos compartidos de las páginas por área — Estudio Jurídico Mosconi */
:root{
  --papel:#f6f2ea; --papel-2:#efe8dc; --blanco:#fffdf9;
  --tinta:#1f1b17; --tinta-soft:#4a423a; --tinta-faint:#857a6e;
  --bordo:#7a2e2a; --bordo-deep:#5c1f1c; --oro:#b08a3e;
  --linea:#ddd3c3; --wsp:#1f9d55; --wsp-deep:#17803f;
  --radio:18px; --sombra:0 18px 50px -24px rgba(40,25,15,.35);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Instrument Sans",system-ui,sans-serif;background:var(--papel);color:var(--tinta);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px}
.angosto{max-width:800px}
.mono{font-family:"IBM Plex Mono",monospace;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}

/* header */
header{position:sticky;top:0;z-index:50;background:rgba(246,242,234,.86);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .3s}
header.scrolled{border-color:var(--linea)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.marca{display:flex;align-items:center;gap:12px;text-decoration:none}
.sello{width:40px;height:40px;flex:none;display:block}
.marca b{display:block;font-size:1rem}
.marca span{display:block;font-size:.78rem;color:var(--tinta-faint)}
.nav ul{display:flex;gap:26px;list-style:none}
.nav ul a{text-decoration:none;font-size:.92rem;color:var(--tinta-soft)}
.nav ul a:hover,.nav ul a[aria-current]{color:var(--bordo)}
.btn{display:inline-flex;align-items:center;gap:10px;border:0;cursor:pointer;font:600 .95rem "Instrument Sans";padding:12px 20px;border-radius:999px;text-decoration:none;transition:transform .15s,background .2s}
.btn:active{transform:scale(.97)}
.btn-wsp{background:var(--wsp);color:#fff;box-shadow:0 8px 22px -10px rgba(31,157,85,.7)}
.btn-wsp:hover{background:var(--wsp-deep)}
.btn-ghost{background:transparent;color:var(--tinta);border:1px solid var(--linea)}
.btn-ghost:hover{border-color:var(--tinta)}
.btn svg{width:18px;height:18px;flex:none}

/* hero de área */
.area-hero{padding:40px 0 64px;position:relative;overflow:hidden}
.area-hero::after{content:attr(data-letra);position:absolute;right:-10px;top:-40px;font-size:24rem;font-weight:700;color:var(--bordo);opacity:.05;line-height:1;pointer-events:none}
.migas{font-size:.85rem;color:var(--tinta-faint);margin-bottom:22px}
.migas a{text-decoration:none;color:var(--tinta-soft)}
.migas a:hover{color:var(--bordo)}
h1{font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.05;letter-spacing:-.03em;font-weight:700;max-width:16ch}
h1 em,h2 em{font-style:normal;color:var(--bordo)}
.bajada{font-size:1.14rem;color:var(--tinta-soft);max-width:38em;margin:18px 0 26px;text-align:justify}
.hero-acciones{display:flex;gap:12px;flex-wrap:wrap}
.indice{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.indice a{border:1px solid var(--linea);border-radius:999px;padding:7px 14px;font-size:.86rem;text-decoration:none;color:var(--tinta-soft);transition:all .2s}
.indice a:hover{border-color:var(--bordo);color:var(--bordo)}

/* cuerpo */
section{padding:64px 0}
section.alt{background:var(--papel-2)}
h2{font-size:clamp(1.6rem,3.2vw,2.3rem);line-height:1.15;letter-spacing:-.02em;margin:8px 0 18px}
h3{font-size:1.12rem;margin:22px 0 8px}
.cuerpo p{color:var(--tinta-soft);margin-bottom:14px;text-align:justify;hyphens:auto}
.cuerpo ul{color:var(--tinta-soft);padding-left:20px;margin-bottom:14px}
.cuerpo li{margin-bottom:6px}
.cuerpo b{color:var(--tinta)}
.cita{font-size:.82rem;color:var(--tinta-faint)}
.nota{background:var(--blanco);border-left:3px solid var(--oro);border-radius:0 12px 12px 0;padding:14px 18px;margin:18px 0;color:var(--tinta-soft);font-size:.95rem;text-align:justify}

/* línea de pasos */
.linea-pasos{list-style:none;position:relative;padding-left:0;margin-top:8px}
.linea-pasos li{position:relative;padding:0 0 26px 54px}
.linea-pasos li::before{content:counter(p);counter-increment:p;position:absolute;left:0;top:0;width:36px;height:36px;border-radius:50%;background:var(--blanco);border:2px solid var(--bordo);color:var(--bordo);display:grid;place-items:center;font-weight:700;font-size:.9rem}
.linea-pasos li::after{content:"";position:absolute;left:17px;top:38px;bottom:4px;width:2px;background:var(--linea)}
.linea-pasos li:last-child::after{display:none}
.linea-pasos{counter-reset:p}
.linea-pasos b{display:block;color:var(--tinta);margin-bottom:4px}
.linea-pasos span{color:var(--tinta-soft);display:block;text-align:justify}

/* tarjetas */
.grilla{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:10px}
.tarj{background:var(--blanco);border:1px solid var(--linea);border-radius:var(--radio);padding:22px}
.tarj h3{margin:0 0 6px}
.tarj p{color:var(--tinta-soft);font-size:.95rem;margin:0;text-align:justify}

/* herramienta interactiva */
.herramienta{background:var(--blanco);border-radius:var(--radio);box-shadow:var(--sombra);padding:28px;margin-top:10px}
.herramienta fieldset{border:0;margin-bottom:18px}
.herramienta legend{font-weight:600;margin-bottom:10px}
.opciones{display:flex;gap:8px;flex-wrap:wrap}
.opciones label{cursor:pointer}
.opciones input{position:absolute;opacity:0;pointer-events:none}
.opciones span{display:inline-block;border:1px solid var(--linea);border-radius:999px;padding:8px 16px;font-size:.92rem;color:var(--tinta-soft);transition:all .2s}
.opciones input:checked+span{background:var(--bordo);border-color:var(--bordo);color:var(--papel)}
.opciones input:focus-visible+span{outline:2px solid var(--oro);outline-offset:2px}
.resultado{border-top:1px solid var(--linea);padding-top:18px;margin-top:6px;min-height:90px}
.resultado b.grande{display:block;font-size:1.25rem;color:var(--bordo);margin-bottom:8px}
.resultado p{color:var(--tinta-soft);text-align:justify;margin-bottom:8px}
.reparto{display:flex;height:14px;border-radius:99px;overflow:hidden;margin:12px 0 6px;background:var(--papel-2)}
.reparto i{display:block;height:100%;transition:width .6s cubic-bezier(.2,.8,.2,1)}
.leyenda{display:flex;gap:14px;flex-wrap:wrap;font-size:.85rem;color:var(--tinta-soft)}
.leyenda span::before{content:"";display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;background:var(--c)}
.pestanas{display:flex;gap:6px;background:var(--papel-2);padding:5px;border-radius:999px;width:fit-content;margin-bottom:20px;flex-wrap:wrap}
.pestanas button{border:0;background:transparent;font:600 .92rem "Instrument Sans";padding:9px 18px;border-radius:999px;cursor:pointer;color:var(--tinta-soft)}
.pestanas button[aria-selected="true"]{background:var(--blanco);color:var(--bordo);box-shadow:0 4px 12px -6px rgba(0,0,0,.25)}
.panel[hidden]{display:none}
.dos-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dos-col > div{min-width:0}
.herramienta input{min-width:0}
.herramienta input[type=date]{font:1rem "Instrument Sans";padding:11px 14px;border:1px solid var(--linea);border-radius:12px;background:var(--papel);color:var(--tinta);max-width:100%}

/* faq */
.faq details{border-bottom:1px solid var(--linea);padding:18px 0}
.faq summary{list-style:none;cursor:pointer;font-weight:600;font-size:1.03rem;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--bordo);font-size:1.4rem;line-height:1;transition:transform .3s;flex:none}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin-top:10px;color:var(--tinta-soft);text-align:justify}

/* cta */
.cta{background:var(--bordo);color:var(--papel);border-radius:28px;padding:56px 36px;text-align:center;position:relative;overflow:hidden}
.cta::before{content:"§";position:absolute;right:-20px;top:-80px;font-size:22rem;opacity:.07;font-weight:700}
.cta h2 em{color:var(--oro)}
.cta p{color:#ecd9d4;margin:10px auto 26px;max-width:32em}
.otras{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:30px}
.otras a{color:var(--tinta-soft);text-decoration:none;border:1px solid var(--linea);border-radius:999px;padding:8px 16px;font-size:.9rem}
.otras a:hover{color:var(--bordo);border-color:var(--bordo)}

footer{padding:44px 0 110px;color:var(--tinta-faint);font-size:.85rem}
.foot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:1px solid var(--linea);padding-top:26px}
footer p{max-width:560px;text-align:justify}

/* whatsapp flotante */
.wsp-flota{position:fixed;right:20px;bottom:20px;z-index:60;width:60px;height:60px;border-radius:50%;background:var(--wsp);display:grid;place-items:center;box-shadow:0 12px 30px -8px rgba(31,157,85,.8);transition:transform .2s}
.wsp-flota:hover{transform:scale(1.08)}
.wsp-flota svg{width:30px;height:30px;fill:#fff}
.wsp-flota::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--wsp);animation:onda 2.2s infinite}
@keyframes onda{to{transform:scale(1.6);opacity:0}}

.rv{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.rv.visible{opacity:1;transform:none}

@media (max-width:900px){.nav ul{display:none}.grilla{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.grilla,.dos-col{grid-template-columns:1fr}.nav .btn span{display:none}section{padding:48px 0}.cta{padding:44px 20px}.herramienta{padding:20px}.area-hero::after{font-size:14rem}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}
