:root{ --ink:#260607; --ink-2:#2F0A0B; --ink-3:#1E0405; --panel:#3B1012; --line:#4E191B; --line-2:#632325; --bone:#F2E9DA; --bone-dim:#D3BFA9; --mist:#A98F7E; --amber:#C79A4E; --amber-lite:#E9C87E; --oxide:#D9452F; --sh:#2A0708; --max:1280px; --pad:clamp(1.15rem,5vw,4.5rem); --disp:"Fraunces",Georgia,serif; --body:"Archivo",-apple-system,system-ui,sans-serif; --mono:"IBM Plex Mono",ui-monospace,monospace; } *{margin:0;padding:0;box-sizing:border-box} [hidden]{display:none !important} /* OJO: scroll-behavior:smooth en hace que, al volver atras, el navegador restaure la posicion ANIMANDO desde arriba (salta arriba y luego baja solo). El desplazamiento suave de las anclas lo hace enigma.js con scrollIntoView. */ html{-webkit-text-size-adjust:100%;scroll-behavior:auto} body{ background:var(--ink);color:var(--bone); font-family:var(--body);font-weight:400;line-height:1.6; font-size:clamp(1rem,.55vw + .85rem,1.14rem); overflow-x:hidden;-webkit-font-smoothing:antialiased; letter-spacing:.006em; } img{display:block;max-width:100%} a{color:inherit;text-decoration:none} ::selection{background:var(--amber);color:#2A0708} :focus-visible{outline:2px solid var(--amber-lite);outline-offset:3px;border-radius:2px} /* ---------- type ---------- */ .mono{font-family:var(--mono);font-weight:500;font-size:.72rem;letter-spacing:.26em;text-transform:uppercase} .eyebrow{font-family:var(--mono);font-weight:500;font-size:.7rem;letter-spacing:.34em;text-transform:uppercase;color:var(--amber);display:inline-flex;align-items:center;gap:.7em;flex-wrap:wrap} .eyebrow::before{content:"";width:26px;height:1px;background:var(--amber);opacity:.7} .eyebrow .xno{color:var(--mist);letter-spacing:.22em;padding-left:.2em;border-left:1px solid var(--line);margin-left:.2em} h1,h2,h3{font-family:var(--disp);font-weight:700;line-height:.96;letter-spacing:-.015em} .serif-it{font-family:var(--disp);font-style:italic;font-weight:500} /* ---------- layout ---------- */ .wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)} .band{padding-block:clamp(3.6rem,7.5vw,6.6rem)} section[id],[id]:target,h1[id],h2[id],h3[id],article[id],div[id]{scroll-margin-top:96px} @media(max-width:980px){section[id],[id]:target,h1[id],h2[id],h3[id],article[id],div[id]{scroll-margin-top:80px}} .rule{height:1px;background:var(--line);border:0} .hair{border-top:1px solid var(--line)} /* ---------- nav ---------- */ header.nav{position:fixed;inset:0 0 auto 0;z-index:60; display:flex;align-items:center;justify-content:space-between; gap:1rem;padding:.9rem var(--pad); background:linear-gradient(to bottom,rgba(38,6,7,.92),rgba(38,6,7,0)); transition:background .4s ease,box-shadow .4s ease,padding .4s ease} header.nav.stuck{background:rgba(38,6,7,.9);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px); box-shadow:0 1px 0 var(--line);padding-block:.7rem} .brand{display:flex;align-items:center;gap:.7rem;font-family:var(--disp);font-weight:700; font-size:1.12rem;letter-spacing:.01em} .brand .mark{width:34px;height:34px;flex:none} .brand .mark .spin{transform-origin:20px 20px;transition:transform .8s cubic-bezier(.16,.9,.24,1)} .brand:hover .mark .spin{transform:rotate(72deg)} .nav-links{display:flex;gap:1.6rem;align-items:center} .nav-links a{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--bone-dim);transition:color .25s;position:relative;padding-block:.2em} .nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1px;background:var(--amber);transition:right .3s ease} .nav-links a:hover{color:var(--bone)} .nav-links a:hover::after,.nav-links a.active::after{right:0} .nav-links a.active{color:var(--amber)} .nav-cta{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase; border:1px solid var(--amber);color:var(--amber);padding:.6em 1.1em;border-radius:999px; transition:background .3s,color .3s,box-shadow .3s;position:relative} .nav-cta:hover{background:var(--amber);color:#2A0708;box-shadow:0 8px 26px -10px rgba(199,154,78,.7)} @media(max-width:900px){.nav-links{display:none}} /* ---------- hero ---------- */ .hero{position:relative;min-height:clamp(540px,82vh,780px);min-height:clamp(540px,82svh,780px);display:flex;align-items:flex-end; overflow:hidden;padding-top:clamp(5rem,8vh,6.5rem);padding-bottom:clamp(2rem,5vw,4rem)} .hero-bg{position:absolute;inset:-8% 0 0 0;z-index:0} .hero-bg img{width:100%;height:112%;object-fit:cover; filter:sepia(.38) hue-rotate(-14deg) saturate(1.35) contrast(1.06)} .hero-bg::after{content:"";position:absolute;inset:0; background: radial-gradient(120% 90% at 78% 18%,rgba(199,154,78,.16),transparent 55%), linear-gradient(to top,var(--ink) 4%,rgba(38,6,7,.55) 46%,rgba(38,6,7,.72) 100%)} .hero-grid{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5; background-image:linear-gradient(var(--line) 1px,transparent 1px); background-size:100% 33.33vh; -webkit-mask-image:linear-gradient(to bottom,transparent,#000 30%,#000 70%,transparent); mask-image:linear-gradient(to bottom,transparent,#000 30%,#000 70%,transparent)} .hero-scan{position:absolute;left:0;right:0;top:0;height:2px;z-index:1;pointer-events:none; background:linear-gradient(90deg,transparent,rgba(230,201,130,.55),transparent); opacity:0;animation:scan 7s ease-in-out infinite;animation-delay:1.6s} @keyframes scan{0%{top:6%;opacity:0}8%{opacity:.9}46%{opacity:.5}92%{opacity:0}100%{top:90%;opacity:0}} .hero-inner{position:relative;z-index:2;width:100%} .hero-tag{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;align-items:center;margin-bottom:clamp(1.4rem,3vw,2.4rem)} .hero-tag .dot{width:7px;height:7px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 4px rgba(199,154,78,.18);animation:pulseDot 2.4s ease-in-out infinite} @keyframes pulseDot{0%,100%{box-shadow:0 0 0 4px rgba(199,154,78,.18)}50%{box-shadow:0 0 0 7px rgba(199,154,78,.05)}} .hero h1{font-size:clamp(2.4rem,6.2vw,5.2rem);font-weight:600; letter-spacing:-.022em;line-height:.92;max-width:16ch} .hero h1 .li{display:block;overflow:hidden} .hero h1 .li > span{display:block;transform:translateY(105%); transition:transform 1s cubic-bezier(.16,.9,.24,1)} .loaded .hero h1 .li > span{transform:translateY(0)} .hero h1 .li:nth-child(2) > span{transition-delay:.09s} .hero h1 .li:nth-child(3) > span{transition-delay:.18s} .hero h1 em{font-style:italic;font-weight:500;color:var(--amber-lite)} .hero h1 .cursor{display:inline-block;width:.09em;height:.82em;background:var(--amber); margin-left:.06em;vertical-align:baseline;opacity:0;transition:opacity .3s .95s;animation:blink 1.05s steps(2,start) infinite 1.3s} .loaded .hero h1 .cursor{opacity:1} @keyframes blink{0%,50%{opacity:1}50.01%,100%{opacity:0}} .hero-sub{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end; gap:1.6rem;margin-top:clamp(1.8rem,4vw,3rem);max-width:100%} .hero-sub p{max-width:40ch;color:var(--bone-dim);font-size:clamp(1rem,1.4vw,1.22rem);line-height:1.55} .hero-sub p b{color:var(--bone);font-weight:600} .hero-cta{display:inline-flex;align-items:center;gap:.7em;white-space:nowrap; background:var(--amber);color:#2A0708;font-family:var(--mono);font-weight:600; font-size:.74rem;letter-spacing:.14em;text-transform:uppercase; padding:1.05em 1.6em;border-radius:999px;transition:transform .3s,box-shadow .3s; box-shadow:0 10px 40px -12px rgba(199,154,78,.6);position:relative;overflow:hidden} .hero-cta::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45),transparent 70%); transform:translateX(-120%);transition:transform .7s ease} .hero-cta:hover::before{transform:translateX(120%)} .hero-cta:hover{transform:translateY(-2px);box-shadow:0 16px 50px -12px rgba(199,154,78,.75)} .hero-cta svg{width:16px;height:16px;position:relative} .hero-reveal{opacity:0;transform:translateY(18px);transition:opacity 1s .5s ease,transform 1s .5s cubic-bezier(.16,.9,.24,1)} .loaded .hero-reveal{opacity:1;transform:none} /* hero ticker (injerto C: cursor/ticker técnico) */ .ticker{margin-top:clamp(1.6rem,3.4vw,2.6rem);border-top:1px solid var(--line);border-bottom:1px solid var(--line); overflow:hidden;position:relative;background:rgba(38,6,7,.4); -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent); opacity:0;transition:opacity 1s .9s} .loaded .ticker{opacity:1} .ticker-track{display:inline-flex;gap:2.6rem;white-space:nowrap;padding:.62rem 0; font-family:var(--mono);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mist); animation:tick 34s linear infinite;will-change:transform} .ticker:hover .ticker-track{animation-play-state:paused} .ticker-track span{display:inline-flex;align-items:center;gap:.6em} .ticker-track b{color:var(--amber);font-weight:500} .ticker-track i{width:5px;height:5px;border-radius:50%;background:var(--line-2);font-style:normal;display:inline-block} @keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}} .scrollhint{position:absolute;left:var(--pad);bottom:1.4rem;z-index:2;font-family:var(--mono); font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:var(--mist); display:flex;align-items:center;gap:.6em;opacity:0;transition:opacity 1s 1.2s} .loaded .scrollhint{opacity:1} .scrollhint .bar{width:1px;height:34px;background:linear-gradient(var(--amber),transparent); animation:drop 2.4s ease-in-out infinite} @keyframes drop{0%,100%{transform:scaleY(.3);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}} @media(max-width:900px){.scrollhint{display:none}} /* ---------- reveal util ---------- El estado oculto vive SOLO bajo html.anim (v5): sin JS todo es visible. */ /* ---------- section head ---------- */ .shead{display:grid;grid-template-columns:1fr;gap:1.1rem;margin-bottom:clamp(2.4rem,5vw,4rem)} .shead h2{font-size:clamp(1.85rem,3.4vw,2.85rem);font-weight:700} .shead .lead{color:var(--bone-dim);max-width:52ch;font-size:clamp(1.02rem,1.3vw,1.2rem)} .idx{font-family:var(--mono);font-size:.7rem;letter-spacing:.3em;color:var(--mist)} /* ---------- manifiesto ---------- */ .manifesto{position:relative;background:var(--ink-2);border-block:1px solid var(--line)} .manifesto .wrap{position:relative} .mani-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(2rem,4.5vw,4.5rem);align-items:start;margin-top:1.6rem} @media(max-width:940px){.mani-grid{grid-template-columns:1fr;gap:2.6rem}} .manifesto .big{font-family:var(--disp);font-weight:600;line-height:1.02;letter-spacing:-.02em; font-size:clamp(1.5rem,2.7vw,2.3rem);max-width:20ch} .manifesto .big em{font-style:italic;color:var(--amber-lite)} .manifesto .big .strike{position:relative;color:var(--mist)} .manifesto .big .strike::after{content:"";position:absolute;left:-2%;right:-2%;top:52%;height:2px; background:var(--oxide);transform:scaleX(0);transform-origin:left;transition:transform .8s .3s cubic-bezier(.7,0,.3,1)} .manifesto .big.in .strike::after{transform:scaleX(1)} .manifesto .foot{display:flex;flex-wrap:wrap;gap:1.4rem 2.6rem;margin-top:clamp(2rem,4vw,3rem); align-items:center} .stamp{display:inline-grid;place-items:center;width:112px;height:112px;flex:none} .stamp svg{width:100%;height:100%} .stamp .ring{transform-origin:60px 60px;animation:sealspin 60s linear infinite} @keyframes sealspin{to{transform:rotate(360deg)}} /* ---------- DOSSIER (injerto B: redacción + stampIn / injerto C: gráfica draw) ---------- */ .dossier{position:relative;background:linear-gradient(180deg,#12151f,#0d1017); border:1px solid var(--line-2);border-radius:5px;padding:clamp(1.25rem,2.6vw,1.85rem); box-shadow:0 40px 90px -50px #000,0 2px 0 rgba(0,0,0,.4),inset 0 1px 0 rgba(236,230,214,.05); overflow:hidden} .dossier::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5; background:repeating-linear-gradient(180deg,transparent 0 25px,rgba(99,35,37,.28) 25px 26px)} .dossier::after{content:"";position:absolute;inset:0;pointer-events:none; background:radial-gradient(120% 90% at 90% 8%,rgba(199,154,78,.10),transparent 55%)} .dossier-h{position:relative;display:flex;justify-content:space-between;gap:1rem;align-items:baseline; font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mist); border-bottom:1px solid var(--line-2);padding-bottom:.85rem;padding-right:6.5rem;line-height:1.5} .dossier-h b{color:var(--amber);font-weight:500} .dossier-meta{position:relative;font-family:var(--mono);font-size:.58rem;letter-spacing:.14em; text-transform:uppercase;color:var(--bone-dim);margin-top:.9rem;display:flex;flex-wrap:wrap;gap:.3em .9em} .dossier-meta b{color:var(--amber-lite);font-weight:500} .dlines{position:relative;margin-top:1rem;display:grid;gap:.62rem} .dline{position:relative;height:8px;border-radius:2px;background:rgba(180,175,160,.13);overflow:hidden} .dline.w1{width:94%}.dline.w2{width:80%}.dline.w3{width:97%}.dline.w4{width:66%}.dline.w5{width:88%}.dline.w6{width:73%} .dline.redact::after{content:"";position:absolute;inset:0;border-radius:2px; background:linear-gradient(90deg,#04060b,#0b0e16 60%,#04060b); box-shadow:inset 0 0 0 1px rgba(0,0,0,.6); transform:scaleX(0);transform-origin:left; transition:transform .7s cubic-bezier(.72,0,.18,1);transition-delay:var(--rd,0s)} .dossier.in .dline.redact::after{transform:scaleX(1)} .dline.redact::before{content:"";position:absolute;left:.4em;top:50%;width:5px;height:1px;background:var(--oxide); transform:translateY(-50%);z-index:2;opacity:0;transition:opacity .4s;transition-delay:calc(var(--rd,0s) + .55s)} .dossier.in .dline.redact::before{opacity:.9} /* mini gráfica forense (draw) */ .dchart{position:relative;margin-top:1.15rem;height:104px;border:1px solid var(--line-2);border-radius:3px; background:linear-gradient(180deg,rgba(59,16,18,.6),rgba(38,6,7,.3));overflow:hidden} .dchart .lbl{position:absolute;top:.5rem;left:.6rem;z-index:2;font-family:var(--mono);font-size:.52rem; letter-spacing:.14em;text-transform:uppercase;color:var(--mist)} .dchart svg{position:absolute;inset:0;width:100%;height:100%} .dchart .grid{stroke:rgba(99,35,37,.55);stroke-width:.6} .dchart .base{stroke:var(--line-2);stroke-width:1;stroke-dasharray:2 3} .dchart .area{opacity:0;transition:opacity 1.1s 1.15s ease} .dossier.in .dchart .area{opacity:1} .dchart .plot{fill:none;stroke:var(--amber-lite);stroke-width:2;stroke-linecap:round;stroke-linejoin:round; stroke-dasharray:var(--pl,600);stroke-dashoffset:var(--pl,600);transition:stroke-dashoffset 1.9s .35s cubic-bezier(.5,0,.2,1)} .dossier.in .dchart .plot{stroke-dashoffset:0} .dchart .dotc{fill:var(--amber);opacity:0;transition:opacity .4s 2.1s} .dossier.in .dchart .dotc{opacity:1} .dsign-row{position:relative;display:flex;gap:1.6rem;margin-top:1.15rem;align-items:flex-end} .dsign{flex:1;min-width:0} .dsign .dk{font-family:var(--mono);font-size:.54rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mist)} .dsign svg{height:34px;width:100%;overflow:visible;margin-top:.1rem} .dsign path{fill:none;stroke:var(--amber-lite);stroke-width:2;stroke-linecap:round;stroke-linejoin:round; stroke-dasharray:var(--len,400);stroke-dashoffset:var(--len,400);transition:stroke-dashoffset 1.5s ease;transition-delay:var(--sd,.5s)} .dossier.in .dsign path{stroke-dashoffset:0} .dsign .baseline{stroke:var(--line-2);stroke-width:1} .dstamp{position:absolute;right:5.5%;bottom:8%;width:112px;height:112px;z-index:4; opacity:0;transform:rotate(-13deg) scale(2.3);pointer-events:none; filter:drop-shadow(0 6px 14px rgba(0,0,0,.5))} .dossier.in .dstamp{animation:stampIn .66s cubic-bezier(.2,1.35,.42,1) forwards;animation-delay:1.05s} @keyframes stampIn{ 0%{opacity:0;transform:rotate(-13deg) scale(2.3)} 55%{opacity:1} 72%{transform:rotate(-13deg) scale(.9)} 86%{transform:rotate(-13deg) scale(1.04)} 100%{opacity:.96;transform:rotate(-13deg) scale(1)}} .dtag{position:absolute;top:1rem;right:1rem;z-index:4;font-family:var(--mono);font-weight:500;font-size:.54rem; letter-spacing:.24em;text-transform:uppercase;color:var(--oxide);border:1px solid var(--oxide); padding:.3em .6em;border-radius:2px;transform:rotate(4deg);opacity:0;transition:opacity .5s .6s,transform .5s .6s; background:rgba(176,58,43,.06)} .dossier.in .dtag{opacity:.92;transform:rotate(4deg) translateY(0)} /* stats row */ .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line); border:1px solid var(--line);margin-top:clamp(2.4rem,5vw,3.6rem)} .stat{background:var(--ink);padding:clamp(1.3rem,2.6vw,2rem);position:relative;overflow:hidden;transition:background .35s} .stat:hover{background:var(--ink-2)} .stat::after{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:linear-gradient(90deg,var(--amber),transparent);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--d,0s)} .stat.in::after{transform:scaleX(1)} .stat .n{font-family:var(--disp);font-weight:700;font-size:clamp(1.8rem,3.2vw,2.6rem);line-height:1;letter-spacing:-.02em} .stat .n .u{font-size:.5em;color:var(--amber);vertical-align:.15em;margin-left:.1em} .stat .l{margin-top:.6rem;color:var(--bone-dim);font-size:.82rem;line-height:1.4} @media(max-width:760px){.stats{grid-template-columns:repeat(2,1fr)}} /* ---------- peritaje + casos ---------- */ .split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,5rem);align-items:start} @media(max-width:900px){.split{grid-template-columns:1fr}} .explain p{color:var(--bone-dim);margin-top:1.1rem;max-width:46ch} .explain p strong{color:var(--bone);font-weight:600} .cases{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:3px;overflow:hidden} .case{background:var(--ink);padding:1.15rem 1.3rem;display:grid;grid-template-columns:auto 1fr auto; gap:.4rem 1rem;align-items:baseline;transition:background .3s;position:relative} .case::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--amber);transform:scaleY(0);transform-origin:top;transition:transform .35s} .case:hover{background:var(--ink-2)} .case:hover::before{transform:scaleY(1)} .case .k{font-family:var(--mono);font-size:.72rem;color:var(--amber);letter-spacing:.1em} .case .t{font-family:var(--disp);font-weight:600;font-size:1.12rem} .case .d{grid-column:2/4;color:var(--mist);font-size:.9rem;margin-top:.1rem} .case .arrow{color:var(--mist);font-family:var(--disp);font-size:1.1rem;transition:transform .3s,color .3s} .case:hover .arrow{transform:translateX(4px);color:var(--amber)} /* ---------- doble firma / equipo ---------- */ .firmawrap{background:var(--ink-2);border-block:1px solid var(--line);position:relative;overflow:hidden} .print{position:absolute;top:clamp(-2rem,-4vw,-1rem);right:-3%;width:clamp(180px,26vw,340px);height:auto;z-index:0; color:var(--amber);opacity:.05;pointer-events:none} .print path{fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round; stroke-dasharray:var(--fl,300);stroke-dashoffset:var(--fl,300);transition:stroke-dashoffset 2.2s ease;transition-delay:calc(var(--fd,0s))} .firmawrap.print-in .print path{stroke-dashoffset:0} .firmawrap .wrap{position:relative;z-index:1} .duo-team{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line); border:1px solid var(--line);margin-top:clamp(2rem,4vw,3rem)} @media(max-width:820px){.duo-team{grid-template-columns:1fr}} .perita{background:var(--ink);padding:clamp(1.6rem,3.5vw,2.6rem);position:relative;transition:background .4s} .perita:hover{background:var(--ink-2)} .perita .mono-mark{display:flex;align-items:center;gap:1.1rem;margin-bottom:1.3rem} .mono-badge{width:78px;height:78px;flex:none;border:1px solid var(--line);border-radius:50%; display:grid;place-items:center;font-family:var(--disp);font-weight:700;font-size:1.7rem; letter-spacing:.02em;color:var(--bone);position:relative;background: radial-gradient(circle at 32% 28%,rgba(199,154,78,.16),transparent 60%);transition:border-color .4s} .mono-badge::after{content:"";position:absolute;inset:6px;border:1px solid var(--amber);opacity:.35;border-radius:50%;transition:transform .6s,opacity .4s} .perita:hover .mono-badge::after{transform:rotate(45deg);opacity:.6} .perita h3{font-size:clamp(1.4rem,2.4vw,1.9rem);font-weight:700} .perita .role{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin-top:.45rem} .perita .cols{font-family:var(--mono);font-size:.72rem;color:var(--mist);margin-top:.3rem;letter-spacing:.06em} .perita ul{list-style:none;margin-top:1.3rem;display:grid;gap:.55rem} .perita li{position:relative;padding-left:1.3rem;color:var(--bone-dim);font-size:.92rem;line-height:1.45} .perita li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px; border:1px solid var(--amber);transform:rotate(45deg)} .sig{margin-top:1.5rem;height:56px;position:relative} .sig .sig-k{position:absolute;left:0;bottom:0;font-family:var(--mono);font-size:.56rem;letter-spacing:.16em; text-transform:uppercase;color:var(--mist)} .sig svg{height:100%;width:auto;overflow:visible} .sig path.ink{fill:none;stroke:var(--amber-lite);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round; stroke-dasharray:var(--len,1200);stroke-dashoffset:var(--len,1200);transition:stroke-dashoffset 1.8s .2s ease} .perita.in .sig path.ink{stroke-dashoffset:0} /* ---------- disciplinas ---------- */ .disc{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)} @media(max-width:900px){.disc{grid-template-columns:1fr}} .dcard{background:var(--ink);padding:clamp(1.5rem,3vw,2.3rem);position:relative;overflow:hidden;transition:background .4s} .dcard:hover{background:var(--ink-2)} .dcard .glyph{width:46px;height:46px;color:var(--amber);margin-bottom:1.3rem;transition:transform .5s} .dcard:hover .glyph{transform:translateY(-3px) scale(1.04)} .dcard .k{font-family:var(--mono);font-size:.68rem;letter-spacing:.24em;color:var(--mist);text-transform:uppercase} .dcard h3{font-size:clamp(1.3rem,2.1vw,1.65rem);margin-top:.5rem;font-weight:700} .dcard .dl{margin-top:1.2rem;display:grid;gap:.5rem} .dcard .dl span{font-size:.86rem;color:var(--bone-dim);padding-left:1rem;position:relative;line-height:1.4} .dcard .dl span::before{content:"";position:absolute;left:0;top:.6em;width:5px;height:1px;background:var(--amber)} .dcard .edge{position:absolute;top:0;left:0;height:3px;width:100%; background:linear-gradient(90deg,var(--amber),transparent);transform:scaleX(0);transform-origin:left;transition:transform .6s} .dcard:hover .edge{transform:scaleX(1)} /* ---------- catálogo ---------- */ .catbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1.6rem} .acc{border-top:1px solid var(--line)} .acc-item{border-bottom:1px solid var(--line);position:relative} .acc-item::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--amber);transform:scaleY(0);transform-origin:top;transition:transform .4s} .acc-item.open::before,.acc-item:hover::before{transform:scaleY(1)} .acc-h{width:100%;background:none;border:0;color:inherit;cursor:pointer;text-align:left; display:grid;grid-template-columns:auto 1fr auto auto;gap:1rem;align-items:center; padding:1.25rem .2rem;font:inherit;transition:padding .3s} .acc-h:hover{padding-left:.9rem} .acc-item.open .acc-h{padding-left:.9rem} .acc-h .code{font-family:var(--mono);font-size:.76rem;color:var(--amber);letter-spacing:.08em} .acc-h .name{font-family:var(--disp);font-weight:600;font-size:clamp(1.15rem,2.4vw,1.7rem);letter-spacing:-.01em} .acc-h .disc-tag{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase; color:var(--mist);border:1px solid var(--line);padding:.35em .7em;border-radius:999px;white-space:nowrap;transition:border-color .3s,color .3s} .acc-item.open .acc-h .disc-tag,.acc-h:hover .disc-tag{border-color:var(--amber);color:var(--amber-lite)} .acc-h .pm{width:22px;height:22px;position:relative;flex:none} .acc-h .pm::before,.acc-h .pm::after{content:"";position:absolute;background:var(--amber);inset:50% 0;height:1.5px;transform:translateY(-50%);transition:transform .35s} .acc-h .pm::after{inset:0 50%;width:1.5px;height:auto;transform:translateX(-50%)} .acc-item.open .pm::after{transform:translateX(-50%) scaleY(0)} .acc-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.5,0,.2,1)} .acc-item.open .acc-body{grid-template-rows:1fr} .acc-body > div{overflow:hidden} .acc-body p{padding:0 .2rem 1.5rem;color:var(--bone-dim);max-width:64ch} .acc-body .firma-line{display:inline-flex;align-items:center;gap:.5em;font-family:var(--mono);font-size:.66rem; letter-spacing:.12em;text-transform:uppercase;color:var(--amber);margin-top:.2rem} @media(max-width:680px){.acc-h{grid-template-columns:auto 1fr auto}.acc-h .disc-tag{display:none}} /* ---------- metodología + proceso ---------- */ .methwrap{background:var(--ink-2);border-block:1px solid var(--line)} /* trace connector (injerto C: draw on-scroll de la secuencia) */ .trace{position:relative;height:30px;margin-top:clamp(2rem,4vw,3rem);margin-bottom:-1px} .trace .tline{position:absolute;left:0;right:0;top:14px;height:2px;overflow:visible} .trace .tline path{fill:none;stroke:var(--amber);stroke-width:2;vector-effect:non-scaling-stroke; stroke-dasharray:1000;stroke-dashoffset:1000;transition:stroke-dashoffset 1.7s cubic-bezier(.5,0,.2,1)} .trace.draw .tline path{stroke-dashoffset:0} .trace .tnodes{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr)} .trace .tnode{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding-left:clamp(1rem,2vw,1.4rem)} .trace .tnode .dot{width:14px;height:14px;border-radius:50%;background:var(--ink-2);border:2px solid var(--line-2); position:relative;z-index:2;transition:border-color .4s,box-shadow .4s,background .4s} .trace.draw .tnode.lit .dot{border-color:var(--amber);background:var(--ink);box-shadow:0 0 0 4px rgba(199,154,78,.14)} .trace .tnode .tk{position:absolute;margin-top:34px;font-family:var(--mono);font-size:.56rem;letter-spacing:.16em;color:var(--mist);text-transform:uppercase;transition:color .4s} .trace.draw .tnode.lit .tk{color:var(--amber)} @media(max-width:820px){.trace{display:none}} .meth{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)} @media(max-width:820px){.meth{grid-template-columns:1fr 1fr;margin-top:clamp(2rem,4vw,3rem)}} @media(max-width:480px){.meth{grid-template-columns:1fr}} .mcell{background:var(--ink-2);padding:clamp(1.4rem,2.6vw,2rem);position:relative;transition:background .4s} .mcell:hover{background:var(--ink-3)} .mcell .f{font-family:var(--mono);font-size:.72rem;letter-spacing:.2em;color:var(--amber)} .mcell h3{font-size:1.2rem;margin-top:.7rem;font-weight:700;letter-spacing:0} .mcell p{color:var(--bone-dim);font-size:.88rem;margin-top:.6rem;line-height:1.5} /* proceso custody chain */ .proc{margin-top:clamp(3rem,6vw,5rem);position:relative} .proc-track{position:absolute;top:34px;bottom:34px;width:2px;background:var(--line);left:20px} .chain{position:absolute;left:20px;top:34px;width:2px;background:linear-gradient(var(--amber),var(--amber-lite)); height:0;transition:height 1.4s ease} .proc.in .chain{height:calc(100% - 68px)} .pstep{position:relative;padding-left:4rem;padding-block:1.4rem} .pstep .node{position:absolute;left:11px;top:1.7rem;width:20px;height:20px;border-radius:50%; background:var(--ink);border:2px solid var(--line);display:grid;place-items:center;transition:border-color .4s,box-shadow .4s} .pstep .node::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--line);transition:background .4s} .proc.in .pstep.on .node{border-color:var(--amber);box-shadow:0 0 0 5px rgba(199,154,78,.14)} .proc.in .pstep.on .node::after{background:var(--amber)} .pstep .pk{font-family:var(--mono);font-size:.68rem;letter-spacing:.18em;color:var(--amber);text-transform:uppercase} .pstep h3{font-size:clamp(1.35rem,2.3vw,1.8rem);margin-top:.35rem;font-weight:700} .pstep p{color:var(--bone-dim);margin-top:.5rem;max-width:52ch} .pstep .badge{display:inline-block;margin-top:.7rem;font-family:var(--mono);font-size:.62rem;letter-spacing:.12em; text-transform:uppercase;color:var(--amber-lite);border:1px solid var(--amber);border-radius:999px;padding:.4em .9em;opacity:.85} /* ---------- tarifas ---------- */ .price{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4rem);align-items:center} @media(max-width:900px){.price{grid-template-columns:1fr}} .price-hero{background:var(--ink-2);border:1px solid var(--line);padding:clamp(1.8rem,4vw,3rem);position:relative;overflow:hidden} .price-hero::before{content:"";position:absolute;inset:0;background: radial-gradient(90% 120% at 100% 0,rgba(199,154,78,.12),transparent 55%)} .price-hero .from{font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--amber);position:relative} .price-hero .amt{font-family:var(--disp);font-weight:800;font-size:clamp(2.4rem,5vw,3.8rem);line-height:.9;letter-spacing:-.03em;margin-top:.5rem;position:relative} .price-hero .amt small{font-size:.32em;vertical-align:.9em;color:var(--bone-dim);font-weight:500;letter-spacing:0} .price-hero .note{color:var(--bone-dim);margin-top:1.1rem;max-width:34ch;position:relative} .price-list{list-style:none;display:grid;gap:0} .price-list li{display:grid;grid-template-columns:1fr auto;gap:1rem;padding:1.05rem 0;border-bottom:1px solid var(--line);align-items:baseline;transition:padding .3s} .price-list li:first-child{border-top:1px solid var(--line)} .price-list li:hover{padding-left:.5rem} .price-list .pl-t{font-family:var(--disp);font-weight:600;font-size:1.1rem} .price-list .pl-d{color:var(--mist);font-size:.84rem;margin-top:.15rem} .price-list .pl-v{font-family:var(--mono);font-size:.82rem;color:var(--amber-lite);white-space:nowrap;letter-spacing:.04em} .price-list .free{color:#7fb98a} /* ---------- ámbito ---------- */ .ambitowrap{position:relative;border-block:1px solid var(--line);overflow:hidden} .ambito-bg{position:absolute;inset:0;z-index:0} .ambito-bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(.7) contrast(1.05);opacity:.5} .ambito-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to right,var(--ink) 30%,rgba(38,6,7,.6))} .ambito-inner{position:relative;z-index:1} .sedes{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:clamp(2rem,4vw,3rem)} @media(max-width:820px){.sedes{grid-template-columns:1fr}} .sede{background:rgba(16,20,30,.86);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);padding:clamp(1.5rem,3vw,2.3rem);transition:background .4s} .sede:hover{background:rgba(59,16,18,.94)} .sede .city{font-family:var(--disp);font-weight:700;font-size:clamp(1.5rem,2.6vw,2.05rem)} .sede .flagk{font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;color:var(--amber);text-transform:uppercase} .sede p{color:var(--bone-dim);font-size:.9rem;margin-top:.8rem;line-height:1.5} .mentor{margin-top:clamp(2rem,4vw,3rem);font-family:var(--mono);font-size:.78rem;color:var(--mist);letter-spacing:.04em} .mentor b{color:var(--bone-dim);font-weight:500} /* ---------- faq ---------- */ .faq .acc-h{grid-template-columns:auto 1fr auto} .faq .acc-h .q{font-family:var(--disp);font-weight:600;font-size:clamp(1.1rem,2.3vw,1.55rem);letter-spacing:-.01em} .faq .acc-h .qn{font-family:var(--mono);font-size:.72rem;color:var(--amber);letter-spacing:.1em} /* ---------- whatsapp band ---------- */ .waband{background:var(--amber);color:#2A0708;position:relative;overflow:hidden} .waband .wrap{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:1.5rem 2rem;align-items:center;justify-content:space-between} .waband h2{font-size:clamp(1.7rem,3.2vw,2.5rem);font-weight:800;letter-spacing:-.02em;color:#2A0708;max-width:18ch} .waband .ghost{position:absolute;right:-4%;top:50%;transform:translateY(-50%);font-family:var(--disp);font-weight:900; font-size:clamp(4.5rem,14vw,12rem);color:rgba(38,6,7,.06);z-index:0;pointer-events:none;line-height:1;white-space:nowrap} .wa-btn{display:inline-flex;align-items:center;gap:.7em;background:#2A0708;color:var(--amber-lite); font-family:var(--mono);font-weight:600;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase; padding:1.15em 1.8em;border-radius:999px;white-space:nowrap;transition:transform .3s,box-shadow .3s} .wa-btn:hover{transform:translateY(-2px);box-shadow:0 14px 40px -12px rgba(38,6,7,.5)} .wa-btn svg{width:20px;height:20px} /* ---------- contacto ---------- */ .contact{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2.4rem,5vw,5rem)} @media(max-width:900px){.contact{grid-template-columns:1fr}} .c-info h2{font-size:clamp(1.85rem,3.4vw,2.85rem);font-weight:700} .c-info .lead{color:var(--bone-dim);margin-top:1.1rem;max-width:38ch} .c-lines{margin-top:2rem;display:grid;gap:1.1rem} .c-line{display:flex;align-items:center;gap:1rem;transition:transform .3s} a.c-line:hover{transform:translateX(4px)} .c-line .ic{width:42px;height:42px;flex:none;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;color:var(--amber);transition:border-color .3s,background .3s} a.c-line:hover .ic{border-color:var(--amber);background:rgba(199,154,78,.08)} .c-line .ic svg{width:18px;height:18px} .c-line .lbl{font-family:var(--mono);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mist)} .c-line .val{font-family:var(--disp);font-weight:600;font-size:1.15rem} form{display:grid;gap:1.1rem} .frow{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem} @media(max-width:560px){.frow{grid-template-columns:1fr}} .field{display:grid;gap:.5rem} .field label{font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim)} .field input,.field textarea,.field select{background:var(--ink-2);border:1px solid var(--line);border-radius:3px; color:var(--bone);font-family:var(--body);font-size:1rem;padding:.85em .9em;transition:border-color .25s,background .25s,box-shadow .25s;width:100%} .field textarea{resize:vertical;min-height:120px} .field input:focus,.field textarea:focus,.field select:focus{border-color:var(--amber);background:var(--ink-3);outline:none;box-shadow:0 0 0 3px rgba(199,154,78,.12)} .field select{-webkit-appearance:none;appearance:none;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--amber) 50%),linear-gradient(135deg,var(--amber) 50%,transparent 50%);background-position:calc(100% - 18px) 1.25em,calc(100% - 13px) 1.25em;background-size:5px 5px,5px 5px;background-repeat:no-repeat} .consent{display:flex;gap:.7rem;align-items:flex-start;font-size:.8rem;color:var(--mist)} .consent input{margin-top:.25em;accent-color:var(--amber)} .submit{display:inline-flex;align-items:center;justify-content:center;gap:.6em;background:var(--amber);color:#2A0708; border:0;border-radius:999px;font-family:var(--mono);font-weight:600;font-size:.76rem;letter-spacing:.14em; text-transform:uppercase;padding:1.1em 1.6em;cursor:pointer;transition:transform .3s,box-shadow .3s;justify-self:start;position:relative;overflow:hidden} .submit::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.4),transparent 70%);transform:translateX(-120%);transition:transform .7s} .submit:hover::before{transform:translateX(120%)} .submit:hover{transform:translateY(-2px);box-shadow:0 14px 40px -12px rgba(199,154,78,.6)} .form-alt{font-size:.8rem;color:var(--mist);margin-top:.2rem} .form-alt a{color:var(--amber-lite);border-bottom:1px solid transparent;transition:border-color .25s} .form-alt a:hover{border-color:var(--amber-lite)} /* campo trampa para bots: fuera de pantalla, nunca visible ni enfocable */ .trampa{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden} /* aviso cuando el envío del formulario falla */ .form-error{font-size:.84rem;line-height:1.5;color:#F2C9C0;background:rgba(180,60,50,.14); border:1px solid rgba(226,120,105,.42);border-radius:4px;padding:.75rem .95rem;margin:.2rem 0 0} /* ---------- footer ---------- */ footer{border-top:1px solid var(--line);background:var(--ink-3)} .f-top{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:2rem;padding-block:clamp(3rem,6vw,4.5rem)} @media(max-width:820px){.f-top{grid-template-columns:1fr 1fr}} @media(max-width:520px){.f-top{grid-template-columns:1fr}} .f-brand .brand{font-size:1.3rem;margin-bottom:1rem} .f-brand p{color:var(--mist);font-size:.86rem;max-width:34ch;line-height:1.5} .f-seal{display:flex;align-items:center;gap:1rem;margin-top:1.6rem} .f-seal svg{width:88px;height:88px} .f-seal .rings{transform-origin:60px 60px;animation:sealspin 80s linear infinite} .f-seal .st{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim);line-height:1.5} .f-col .f-h,.f-col h4{font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);margin-bottom:1.1rem} .f-col a,.f-col span{display:block;color:var(--bone-dim);font-size:.88rem;padding:.32rem 0;transition:color .25s,padding-left .25s} .f-col a:hover{color:var(--bone);padding-left:.35rem} .f-bottom{border-top:1px solid var(--line);padding-block:1.5rem;display:flex;flex-wrap:wrap;gap:.8rem 1.5rem; justify-content:space-between;align-items:center} .f-bottom p{font-family:var(--mono);font-size:.64rem;letter-spacing:.08em;color:var(--mist)} .f-demo a{color:var(--amber-lite);font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase; border:1px solid var(--amber);border-radius:999px;padding:.55em 1.1em;transition:background .3s,color .3s} .f-demo a:hover{background:var(--amber);color:#2A0708} /* counter */ .count[data-count]{font-variant-numeric:tabular-nums} @media(prefers-reduced-motion:reduce){ html{scroll-behavior:auto} *{animation:none!important;transition:none!important} .rv,.rv-l,.hero-reveal,.hero h1 .li>span,.sig path.ink,.ticker,.dsign path,.dchart .plot,.dchart .area,.dchart .dotc,.dtag{opacity:1!important;transform:none!important} .sig path.ink,.dsign path,.dchart .plot{stroke-dashoffset:0!important} .trace .tline path,.print path{stroke-dashoffset:0!important} .chain{height:calc(100% - 68px)!important} .manifesto .big .strike::after,.dline.redact::after,.stat::after{transform:scaleX(1)!important} .dstamp{opacity:.96!important;transform:rotate(-13deg) scale(1)!important} .trace .tnode .dot{border-color:var(--amber)!important} .hero h1 .cursor{display:none} } .dsv{font-family:var(--disp);font-style:italic;font-size:1rem;color:var(--marfil);line-height:1.15;display:flex;flex-direction:column;margin-top:.15rem}.dsv span{font-family:var(--mono);font-style:normal;font-size:.54rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-top:.35rem} /* ---------- perfiles (particular / abogado) ---------- */ html[data-perfil="particular"] [data-solo="abogado"]{display:none!important} html[data-perfil="abogado"] [data-solo="particular"]{display:none!important} main{display:flex;flex-direction:column} main>*{min-width:0;width:100%} /* selector tras el hero */ .perfilwrap{background:var(--ink-2);border-bottom:1px solid var(--line);position:relative;overflow:hidden; padding-block:clamp(3.4rem,7vw,5.5rem)} .perfilwrap::after{content:"";position:absolute;inset:0;pointer-events:none; background:radial-gradient(90% 130% at 85% 0,rgba(199,154,78,.08),transparent 55%)} .perfilwrap .wrap{position:relative;z-index:1} .perfil-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1.2rem 2rem; margin-bottom:clamp(1.8rem,3.5vw,2.6rem)} .perfil-head h2{font-size:clamp(1.9rem,3.8vw,3.1rem);font-weight:700;margin-top:1rem} .perfil-head .aside{font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase; color:var(--mist);max-width:30ch;line-height:1.9} .perfil-cards{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)} @media(max-width:820px){.perfil-cards{grid-template-columns:1fr}} .perfil-card{-webkit-appearance:none;appearance:none;background:var(--ink);border:0;color:inherit;font:inherit;text-align:left;cursor:pointer; padding:clamp(1.6rem,3.2vw,2.5rem);position:relative;overflow:hidden; display:flex;flex-direction:column;align-items:flex-start;gap:.85rem;transition:background .35s} .perfil-card::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%; background:linear-gradient(90deg,var(--amber),transparent);transform:scaleX(0);transform-origin:left;transition:transform .5s} .perfil-card:hover{background:var(--ink-3)} .perfil-card:hover::before{transform:scaleX(1)} .perfil-card .pk{font-family:var(--mono);font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--mist);transition:color .3s} .perfil-card .pt{font-family:var(--disp);font-weight:700;font-size:clamp(1.5rem,2.8vw,2.15rem);line-height:1;letter-spacing:-.015em} .perfil-card .pd{color:var(--bone-dim);max-width:36ch;font-size:.98rem;line-height:1.55} .perfil-card .pgo{font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--amber); display:inline-flex;align-items:center;gap:.6em;margin-top:.4rem} .perfil-card .pgo i{font-style:normal;transition:transform .3s} .perfil-card:hover .pgo i{transform:translateX(4px)} .perfil-card .pstate{position:absolute;top:1.1rem;right:1.1rem;font-family:var(--mono);font-weight:500;font-size:.54rem; letter-spacing:.22em;text-transform:uppercase;color:var(--amber-lite);border:1px solid var(--amber);border-radius:2px; padding:.35em .7em;transform:rotate(3deg);opacity:0;transition:opacity .4s;background:rgba(199,154,78,.07)} .perfil-card[aria-pressed="true"]{background:var(--ink-3);box-shadow:inset 0 0 0 1px var(--amber)} .perfil-card[aria-pressed="true"] .pk{color:var(--amber)} .perfil-card[aria-pressed="true"] .pstate{opacity:.95} .perfil-card[aria-pressed="true"]::before{transform:scaleX(1)} /* chip conmutador fijo */ .perfil-chip{position:fixed;top:70px;right:var(--pad);z-index:55;display:inline-flex;align-items:center;gap:.6em; font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase; background:rgba(38,6,7,.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--line-2);border-radius:999px; padding:.6em 1em;color:var(--mist);cursor:pointer;transition:border-color .3s,box-shadow .3s} .perfil-chip[hidden]{display:none} .perfil-chip:hover{border-color:var(--amber);box-shadow:0 8px 26px -14px rgba(199,154,78,.65)} .perfil-chip .pck{color:var(--amber)} .perfil-chip .pcx{color:var(--mist);opacity:.6} .perfil-chip .pcv{transition:color .3s} .perfil-chip .pcv.on{color:var(--amber-lite)} @media(max-width:900px){.perfil-chip{top:68px}} /* separadores de parte (perforación de expediente) */ .parte{display:flex;align-items:center;gap:1.1rem;width:100%;max-width:var(--max);margin-inline:auto; padding:1rem var(--pad)} .parte::before,.parte::after{content:"";height:0;border-top:1px dashed rgba(199,154,78,.38)} .parte::before{width:clamp(.9rem,3vw,2.4rem)} .parte::after{flex:1} .parte span{font-family:var(--mono);font-size:.58rem;letter-spacing:.24em;text-transform:uppercase; color:var(--mist);white-space:nowrap} .parte span b{color:var(--amber);font-weight:500} html[data-perfil="abogado"] main>.parte[data-for="perfil"]{order:2} html[data-perfil="abogado"] main>.parte[data-for="firma-intro"]{order:3} html[data-perfil="abogado"] main>.parte[data-for="abogados"]{order:4} html[data-perfil="abogado"] main>.parte[data-for="metodologia"]{order:5} html[data-perfil="abogado"] main>.parte[data-for="firma"]{order:6} html[data-perfil="abogado"] main>.parte[data-for="disciplinas"]{order:7} html[data-perfil="abogado"] main>.parte[data-for="catalogo"]{order:8} html[data-perfil="abogado"] main>.parte[data-for="tarifas"]{order:9} /* fichas de formación del equipo */ .pgk{font-family:var(--mono);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--amber); margin-top:1.4rem;padding-bottom:.45rem;border-bottom:1px dashed rgba(199,154,78,.3)} .perita .pgk+ul{margin-top:.9rem} .duo-team .colab{grid-column:1/-1;background:linear-gradient(180deg,#12151f,#0d1017);position:relative} .colab .ctag{position:absolute;top:1.5rem;right:1.5rem;font-family:var(--mono);font-weight:500;font-size:.56rem; letter-spacing:.22em;text-transform:uppercase;color:var(--amber-lite);border:1px solid var(--amber);border-radius:2px; padding:.35em .7em;background:rgba(199,154,78,.07)} @media(max-width:640px){.colab .ctag{position:static;display:inline-block;margin-bottom:1.1rem}} .colab .mono-badge{border-color:var(--amber)} .colab-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:1.4rem 3rem;margin-top:1.2rem} @media(max-width:820px){.colab-grid{grid-template-columns:1fr}} .colab-grid p{color:var(--bone-dim);font-size:.95rem;line-height:1.6} .colab-grid p strong{color:var(--bone);font-weight:600} .colab-grid p+p{margin-top:.9rem} .colab-grid ul{margin-top:0} /* CTA dentro de secciones por perfil */ .pcta{margin-top:clamp(1.6rem,3vw,2.2rem);display:grid;gap:.9rem;justify-items:start} .pcta-note{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mist);line-height:2.1;max-width:52ch} .pcta-note a{color:var(--amber-lite);text-transform:none;letter-spacing:.06em;border-bottom:1px solid rgba(230,201,130,.4);transition:border-color .25s} .pcta-note a:hover{border-color:var(--amber-lite)} /* acciones duales en la banda WhatsApp */ .wa-actions{display:flex;flex-wrap:wrap;gap:.9rem;align-items:center} .wa-mail{display:inline-flex;align-items:center;gap:.6em;border:1.5px solid rgba(38,6,7,.75);color:#2A0708; font-family:var(--mono);font-weight:600;font-size:.74rem;letter-spacing:.08em; padding:1.05em 1.5em;border-radius:999px;white-space:nowrap;transition:background .3s,color .3s} .wa-mail:hover{background:#2A0708;color:var(--amber-lite)} .wa-mail svg{width:17px;height:17px} /* ============ v2 · documento maestro de cambios (ago-2026) ============ */ /* botón ámbar reutilizable */ .contactband{background:var(--ink-2);border-top:1px solid var(--amber);position:relative} .contactband::before{content:"";position:absolute;inset:0;background: radial-gradient(900px 340px at 78% 8%,rgba(199,154,78,.10),transparent 60%);pointer-events:none} .contactband .wrap{position:relative} .contactband .shead{margin-bottom:clamp(1.8rem,3.4vw,2.6rem)} .contactband .c-line>span:last-child{display:grid;gap:.15rem} .contactband .c-line .lbl{display:block} .contactband .submit{border-radius:2px;white-space:nowrap;padding:1.05em 2em;justify-content:center} .contactband .c-form .field label{margin-bottom:.35rem} .btn-amber{display:inline-flex;align-items:center;gap:.6em;background:var(--amber);color:#2A0708; font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600; padding:.95em 1.5em;border:0;cursor:pointer;transition:background .25s,transform .25s} .btn-amber:hover{background:var(--amber-lite);transform:translateY(-2px)} .btn-amber.sm{padding:.7em 1.1em;font-size:.66rem} .btn-amber.lg{padding:1.1em 1.8em;font-size:.78rem} /* --- selector de perfil único (dentro del Exp. 01) --- */ .selector{border:1px solid var(--line);background:var(--ink-2);padding:clamp(1.1rem,2.4vw,1.7rem);margin-bottom:2.2rem} .sel-k{font-family:var(--mono);font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--amber);margin-bottom:.9rem} .sel-btns{display:flex;gap:.7rem;flex-wrap:wrap} .sel-btn{flex:1 1 200px;background:transparent;border:1px solid var(--line-2);color:var(--bone-dim); font-family:var(--mono);font-size:.72rem;letter-spacing:.13em;text-transform:uppercase; padding:1em 1.2em;cursor:pointer;transition:all .25s;text-align:left;position:relative} .sel-btn:hover{border-color:var(--amber);color:var(--bone)} .sel-btn[aria-pressed="true"]{background:var(--amber);border-color:var(--amber);color:#2A0708;font-weight:600} .sel-btn[aria-pressed="true"]::after{content:"✓";position:absolute;right:1em;top:50%;transform:translateY(-50%)} /* --- 4 tarjetas "qué puede aportar" --- */ .cards4{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);margin:2.6rem 0} @media(max-width:1000px){.cards4{grid-template-columns:repeat(2,1fr)}} @media(max-width:560px){.cards4{grid-template-columns:1fr}} .c4{background:var(--ink-2);padding:clamp(1.3rem,2.4vw,1.8rem);transition:background .3s} .c4:hover{background:var(--panel)} .c4k{font-family:var(--mono);font-size:.7rem;letter-spacing:.2em;color:var(--amber);margin-bottom:.9rem} .c4 h3{font-size:clamp(1.05rem,1.5vw,1.24rem);line-height:1.12;margin-bottom:.6rem} .c4 p{color:var(--bone-dim);font-size:.93rem;line-height:1.55} /* --- cuándo NO recomendamos --- */ .cuando{border:1px solid var(--line);border-left:3px solid var(--oxide);background:var(--ink-3); padding:clamp(1.4rem,3vw,2.2rem);margin-top:1rem} .cuando h3{font-size:clamp(1.25rem,2.2vw,1.7rem);margin-bottom:1.1rem} .cuando-list{list-style:none;display:grid;gap:.55rem;margin-bottom:1.2rem} .cuando-list li{position:relative;padding-left:1.5em;color:var(--bone-dim);font-size:.95rem} .cuando-list li::before{content:"—";position:absolute;left:0;color:var(--oxide)} .cuando-cierre{color:var(--bone);font-size:1rem;border-top:1px solid var(--line);padding-top:1.1rem} .cuando-cta{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;flex-wrap:wrap; margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--line)} .cuando-cta p{color:var(--bone-dim);font-size:.95rem;max-width:46ch;margin:0} /* --- ÁREAS DE ESPECIALIZACIÓN --- */ .buscador{border:1px solid var(--line);background:var(--ink-2);padding:clamp(1.1rem,2.4vw,1.6rem);margin-bottom:2.4rem} .busc-k{display:block;font-family:var(--mono);font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--amber);margin-bottom:.8rem} .busc-field{display:flex;align-items:center;gap:.7rem;border:1px solid var(--line-2);background:var(--ink);padding:.2rem .9rem} .busc-field:focus-within{border-color:var(--amber)} .busc-field svg{width:18px;height:18px;color:var(--mist);flex:none} .busc-field input{flex:1;background:transparent;border:0;color:var(--bone);font-family:var(--body); font-size:1rem;padding:.85em 0;outline:none} .busc-field input::placeholder{color:var(--mist)} .busc-clear{background:transparent;border:0;color:var(--mist);font-size:1.5rem;line-height:1;cursor:pointer;padding:0 .2em} .busc-clear:hover{color:var(--amber)} .busc-res{font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mist);margin-top:.8rem;min-height:1em} .areas{display:grid;gap:clamp(2.4rem,5vw,4rem)} .area{border-top:1px solid var(--amber);padding-top:1.6rem} .area-h{margin-bottom:1.6rem} .area-k{font-family:var(--mono);font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;color:var(--amber)} .area-h h3{font-size:clamp(1.6rem,3.2vw,2.4rem);margin:.5rem 0 .8rem} .area-d{color:var(--bone-dim);max-width:72ch;font-size:.98rem;line-height:1.6} .area-aviso{margin-top:1rem;border:1px solid var(--line-2);border-left:3px solid var(--amber); background:var(--ink-2);padding:.9rem 1.1rem;color:var(--bone);font-size:.9rem;max-width:72ch} .cat-acc{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)} @media(max-width:860px){.cat-acc{grid-template-columns:1fr}} .cat-acc .acc-item{background:var(--ink-2);border-bottom:0} .cat-item.open{grid-column:1/-1;background:var(--panel)} .cat-h{padding-block:1.15rem} .cat-h{display:grid !important;grid-template-columns:1fr auto;gap:.35rem 1rem;align-items:start;text-align:left} .cat-name{font-family:var(--disp);font-weight:700;font-size:clamp(1.05rem,1.8vw,1.3rem);line-height:1.15;color:var(--bone);grid-column:1} .cat-desc{grid-column:1;color:var(--bone-dim);font-size:.9rem;line-height:1.5;font-family:var(--body); text-transform:none;letter-spacing:0;max-width:70ch} .cat-h .pm{grid-column:2;grid-row:1/3;align-self:center} .cat-item.open .cat-name{color:var(--amber)} .cat-items{list-style:none;display:grid;gap:1px;background:var(--line);margin:.4rem 0 0} .cat-items li{background:var(--ink-2);padding:1rem 1.2rem;display:grid;gap:.3rem} .it-t{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--amber-lite)} .it-d{color:var(--bone-dim);font-size:.92rem;line-height:1.55} .cat-nota{margin-top:1rem;border-left:2px solid var(--oxide);padding:.2rem 0 .2rem .9rem; color:var(--bone-dim);font-size:.88rem;font-style:italic} .cat-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap; margin-top:1.3rem;padding-top:1.1rem;border-top:1px solid var(--line)} .cat-foot p{color:var(--mist);font-size:.88rem;max-width:52ch;margin:0;padding:0} .area-final{border:1px solid var(--line);background:var(--ink-2);padding:clamp(1.5rem,3vw,2.4rem); margin-top:clamp(2.4rem,5vw,3.6rem);text-align:center} .area-final h3{font-size:clamp(1.3rem,2.6vw,1.9rem);margin-bottom:.8rem} .area-final p{color:var(--bone-dim);max-width:62ch;margin:0 auto 1.4rem} /* --- reseñas --- */ .resenas{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)} @media(max-width:900px){.resenas{grid-template-columns:1fr}} .resena{background:var(--ink-2);padding:clamp(1.4rem,2.6vw,2rem);display:flex;flex-direction:column;gap:1rem;margin:0} .quote-k{font-family:var(--disp);font-size:3rem;line-height:.6;color:var(--amber);opacity:.5} .resena blockquote{color:var(--bone);font-size:1rem;line-height:1.6;flex:1} .resena figcaption{display:grid;gap:.2rem;border-top:1px solid var(--line);padding-top:.9rem} .r-n{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--amber)} .r-c{color:var(--mist);font-size:.85rem} .res-nota{margin-top:1.2rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.16em; text-transform:uppercase;color:var(--mist);text-align:right} /* --- flujo Evaluación → Análisis → Integración → Ratificación --- */ .flow{display:flex;align-items:center;justify-content:center;gap:clamp(.5rem,1.6vw,1.2rem); flex-wrap:wrap;margin-bottom:clamp(1.6rem,3vw,2.2rem);padding:clamp(.9rem,1.8vw,1.3rem); border:1px solid var(--line);background:var(--ink-3)} .flow-step{display:grid;gap:.35rem;justify-items:center;text-align:center;min-width:96px} .flow-step .fk{font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;color:var(--amber)} .flow-step .fn{font-family:var(--disp);font-weight:700;font-size:clamp(.98rem,1.6vw,1.18rem);color:var(--bone)} .flow-ar{color:var(--line-2);flex:none} .flow-ar svg{width:16px;height:26px;transform:rotate(-90deg)} @media(max-width:640px){.flow{flex-direction:column}.flow-ar svg{transform:none;height:22px}} /* --- honorarios --- */ .hon-cols{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)} @media(max-width:760px){.hon-cols{grid-template-columns:1fr}} .hon-col{background:var(--ink-2);padding:clamp(1.2rem,2.4vw,1.7rem)} .hon-list{list-style:none;display:grid;gap:.5rem;margin-top:.7rem} .hon-list li{position:relative;padding-left:1.4em;color:var(--bone-dim);font-size:.93rem} .hon-list li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:1px;background:var(--amber)} .price-hero .note-2{margin-top:.9rem;padding-top:.9rem;border-top:1px solid var(--line);font-size:.86rem} /* --- mapa de España --- */ .mapa-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.95fr);gap:clamp(1.6rem,4vw,3.2rem);align-items:center} @media(max-width:860px){.mapa-grid{grid-template-columns:1fr}} .mapa svg{width:100%;height:auto;max-height:340px} .mapa .es{fill:var(--ink-2);stroke:var(--line-2);stroke-width:1.2} .mapa .es-in{fill:none;stroke:var(--amber);stroke-width:1;opacity:.35;stroke-dasharray:4 6} .mapa .pin{fill:var(--amber)} .mapa .pin-halo{fill:var(--amber);opacity:.1} .mapa .pin-t{font-family:var(--mono);font-size:11px;letter-spacing:.24em;fill:var(--amber)} .mapa .pin-l{stroke:var(--amber);stroke-width:1;opacity:.6} .mapa .pin-halo2{fill:var(--amber);opacity:.16} .mapa .islas ellipse,.mapa .islas circle{fill:var(--ink-2);stroke:var(--line-2);stroke-width:1} .mapa .isl-t{font-family:var(--mono);font-size:7.5px;letter-spacing:.2em;fill:var(--mist)} .mapa .grid-l path{stroke:var(--line-2);stroke-width:.8;stroke-dasharray:2 6} .mapa-grid .sedes{display:grid !important;grid-template-columns:1fr !important;gap:1px;background:var(--line);border:1px solid var(--line)} .mapa-grid .sede{background:var(--ink-2);padding:1.15rem 1.3rem;display:grid;gap:.35rem} .mapa-grid .sede .city{font-size:clamp(1.15rem,2vw,1.5rem);line-height:1.05} .mapa-grid .sede p{font-size:.9rem;color:var(--bone-dim);max-width:46ch} .ambito-nota{margin-top:clamp(1.6rem,3vw,2.4rem);color:var(--bone-dim);max-width:82ch; border-top:1px solid var(--line);padding-top:1.2rem;font-size:.95rem} /* --- blog --- */ /* El índice del blog lleva 3 artículos y va a 3 columnas. «Seguir leyendo» de cada artículo solo tiene 2 hermanos: con 3 columnas fijas quedaba una celda beige vacía a la derecha, así que ahí las columnas se ajustan al contenido. */ .posts{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:1px;background:var(--line)} .posts-idx{grid-auto-flow:row;grid-template-columns:repeat(3,1fr)} @media(max-width:900px){.posts,.posts-idx{grid-auto-flow:row;grid-template-columns:1fr}} .post{background:var(--ink-2);padding:clamp(1.3rem,2.4vw,1.9rem);display:flex;flex-direction:column;gap:.7rem;transition:background .3s} .post:hover{background:var(--panel)} .post-k{font-family:var(--mono);font-size:.64rem;letter-spacing:.24em;text-transform:uppercase;color:var(--amber)} .post h3{font-size:clamp(1.1rem,1.8vw,1.32rem);line-height:1.15} .post p{color:var(--bone-dim);font-size:.93rem;line-height:1.55} .post-go{font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mist);margin-top:auto;padding-top:.5rem} /* --- retrato placeholder de las peritas --- */ .retrato{margin:-1px -1px 1.3rem;border-bottom:1px solid var(--line);background:var(--ink-3);aspect-ratio:4/5;max-height:300px;display:grid;place-items:center} .retrato-ph{display:grid;gap:.9rem;justify-items:center;text-align:center;padding:1rem} .retrato-ph .mono-badge{position:static;transform:none} .ph-note{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mist);line-height:1.7} /* --- sello del bloque "El principio" --- */ .mani-side{display:flex;justify-content:center;align-items:center} .seal-card{border:1px solid var(--line);background:var(--ink-2);padding:clamp(1.4rem,3vw,2.2rem); display:grid;gap:1rem;justify-items:center;text-align:center;max-width:280px;width:100%} .seal-k{font-family:var(--mono);font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;color:var(--mist)} .seal-svg{width:clamp(88px,14vw,120px);height:auto} .seal-t{font-family:var(--disp);font-weight:700;font-size:1.15rem;line-height:1.15;color:var(--bone)} /* --- contacto: formulario --- */ .c-form{display:grid;gap:1.1rem} .c-line.static{cursor:default} .c-info .btn-amber{margin-bottom:1.6rem} /* --- menú hamburguesa --- */ .navbtn{display:none;background:transparent;border:1px solid var(--line-2);color:var(--bone); width:42px;height:38px;cursor:pointer;align-items:center;justify-content:center;flex:none} .navbtn span{display:block;width:18px;height:1.5px;background:currentColor;position:relative;transition:background .2s} .navbtn span::before,.navbtn span::after{content:"";position:absolute;left:0;width:18px;height:1.5px;background:currentColor;transition:transform .28s} .navbtn span::before{top:-6px}.navbtn span::after{top:6px} .navbtn[aria-expanded="true"] span{background:transparent} .navbtn[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)} .navbtn[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)} @media(max-width:980px){ .navbtn{display:flex} .nav-links{display:flex !important;position:fixed;left:0;right:0;top:0;padding:5.4rem var(--pad) 1.8rem; background:rgba(38,6,7,.98);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--line); flex-direction:column;align-items:flex-start;gap:1.15rem;z-index:1; transform:translateY(-101%);transition:transform .38s cubic-bezier(.16,.9,.24,1); box-shadow:0 24px 50px -30px rgba(0,0,0,.9)} .nav-links.open{transform:translateY(0)} .nav-links a{font-size:.84rem;letter-spacing:.14em} header.nav{background:rgba(38,6,7,.86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)} header.nav>.brand,header.nav>.navbtn,header.nav>.nav-cta{position:relative;z-index:2} .brand span{white-space:nowrap;font-size:1rem} .brand .mark{width:28px;height:28px} .nav-cta{font-size:.6rem;padding:.6em .9em;line-height:1.25} } /* ================== v3 · HOME COMO PORTADA (ago-2026) ================== */ .btn-ghost{display:inline-flex;align-items:center;gap:.6em;background:transparent;border:1px solid var(--line-2); color:var(--bone);font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase; padding:.95em 1.5em;cursor:pointer;transition:border-color .25s,color .25s,transform .25s} .btn-ghost:hover{border-color:var(--amber);color:var(--amber-lite);transform:translateY(-2px)} .btn-ghost.lg{padding:1.1em 1.8em;font-size:.78rem} .nav-cta{color:#2A0708;background:var(--amber);border-color:var(--amber)} .nav-cta:hover{background:var(--amber-lite);border-color:var(--amber-lite);color:#2A0708} .btn-amber.full{width:100%;justify-content:center} .shead-c{text-align:center;max-width:52ch;margin-inline:auto} .shead-c.wide{max-width:78ch} .shead-c .eyebrow{justify-content:center} .shead-c .eyebrow::before{display:none} /* ---------- HERO minimo ---------- */ .hero-min{min-height:clamp(500px,74vh,700px);min-height:clamp(500px,74svh,700px);display:flex;align-items:center} .hero-min h1{font-size:clamp(2.5rem,6.4vw,5rem);line-height:1.02;margin:1.1rem 0 0;max-width:16ch} .hero-min h1 em{font-style:italic;font-weight:500;color:var(--amber)} .hero-lead{color:var(--bone-dim);font-size:clamp(1rem,1.5vw,1.18rem);max-width:52ch;margin-top:1.2rem} .hero-btns{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.9rem} .hero-min .hero-sub{display:block} @media(max-width:560px){.hero-btns{flex-direction:column;align-items:stretch} .hero-btns .btn-amber,.hero-btns .btn-ghost{justify-content:center}} /* ---------- PERFIL ---------- */ .perfilband{background:var(--ink-2);border-block:1px solid var(--line);padding-block:clamp(2.4rem,5vw,4rem)} .perfil-t{font-size:clamp(1.5rem,3.2vw,2.3rem);text-align:center;margin-bottom:clamp(1.4rem,3vw,2rem)} .perfil-cards{display:grid;grid-template-columns:1fr 1fr;gap:1rem;max-width:900px;margin-inline:auto} @media(max-width:700px){.perfil-cards{grid-template-columns:1fr}} .pcard{position:relative;text-align:left;background:var(--ink);border:1px solid var(--line-2); padding:1.4rem 1.5rem;cursor:pointer;display:grid;gap:.45rem;transition:all .28s;color:var(--bone)} .pcard:hover{border-color:var(--amber)} .pcard-t{font-family:var(--disp);font-weight:700;font-size:1.22rem;line-height:1.1} .pcard-d{color:var(--bone-dim);font-size:.93rem;line-height:1.5} .pcard-on{font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase; color:#2A0708;background:var(--amber);padding:.3em .7em;justify-self:start;margin-top:.3rem;opacity:0;transition:opacity .25s} .pcard[aria-pressed="true"]{border-color:var(--amber);background:var(--panel)} .pcard[aria-pressed="true"] .pcard-on{opacity:1} /* ---------- ESPECIALIDADES: 3 tarjetas ---------- */ .esp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-top:clamp(2rem,4vw,3rem)} @media(max-width:900px){.esp-grid{grid-template-columns:1fr}} .esp-card{background:var(--ink-2);padding:clamp(1.6rem,3vw,2.4rem);display:flex;flex-direction:column;gap:.8rem; position:relative;transition:background .35s;min-height:clamp(220px,26vw,300px)} .esp-card::after{content:"";position:absolute;inset:auto 0 0 0;height:2px;background:var(--amber); transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.16,.9,.24,1)} .esp-card:hover{background:var(--panel)} .esp-card:hover::after{transform:scaleX(1)} .esp-k{font-family:var(--mono);font-size:.68rem;letter-spacing:.26em;color:var(--amber)} .esp-card h3{font-size:clamp(1.4rem,2.4vw,1.85rem);line-height:1.08} .esp-d{color:var(--bone-dim);font-size:.95rem;line-height:1.55;flex:1} .esp-go::after{content:"";position:absolute;inset:0;cursor:pointer} .esp-go{margin-top:auto;font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase; color:var(--amber);display:inline-flex;align-items:center;gap:.5em;padding-top:.6rem} .esp-go i{transition:transform .3s} .esp-card:hover .esp-go i{transform:translateX(5px)} /* ---------- POR QUE ENIGMA ---------- */ .porqueband{background:var(--ink-3);border-block:1px solid var(--line)} .pq-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.4rem,3vw,2.6rem);margin-top:clamp(2rem,4vw,3rem)} @media(max-width:820px){.pq-grid{grid-template-columns:1fr;gap:1.6rem}} .pq{text-align:center;padding:0 .5rem} .pq-k{display:block;font-family:var(--mono);font-size:.7rem;letter-spacing:.3em;color:var(--amber);margin-bottom:.9rem} .pq p{color:var(--bone-dim);font-size:.97rem;line-height:1.6;max-width:34ch;margin-inline:auto} .pq-more{text-align:center;margin-top:clamp(1.8rem,3.4vw,2.6rem)} .pq-more a{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase; color:var(--amber);border-bottom:1px solid rgba(199,154,78,.4);padding-bottom:.3em;display:inline-flex;gap:.5em} .pq-more a:hover{color:var(--amber-lite);border-color:var(--amber-lite)} .pq-int{margin-top:0;margin-bottom:clamp(2rem,4vw,3rem)} /* ---------- EQUIPO compacto ---------- */ .eq-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);margin-top:clamp(2rem,4vw,3rem)} @media(max-width:760px){.eq-grid{grid-template-columns:1fr}} .eq-card{background:var(--ink-2);padding:clamp(1.4rem,2.6vw,2rem);display:grid;gap:.5rem;justify-items:center;text-align:center} .eq-foto{width:clamp(104px,14vw,146px);aspect-ratio:1;border-radius:50%;background:var(--ink-3); border:1px solid var(--line-2);display:grid;place-items:center;gap:.3rem;margin-bottom:.7rem} .eq-foto .mono-badge{position:relative;transform:none;width:clamp(58px,7vw,74px);height:clamp(58px,7vw,74px);font-size:clamp(1.15rem,2vw,1.5rem);border-color:var(--line-2)} .eq-foto .ph-note{font-size:.5rem;letter-spacing:.12em} .eq-foto.big{width:clamp(120px,16vw,180px);border-radius:2px} .eq-card h3{font-size:clamp(1.15rem,2vw,1.4rem);line-height:1.1} .eq-rol{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--amber)} .eq-bio{color:var(--bone-dim);font-size:.93rem;line-height:1.55;max-width:38ch} .eq-reg{font-family:var(--mono);font-size:.68rem;color:var(--mist);letter-spacing:.06em} /* ---------- CONTACTO minimo ---------- */ .contacto-min{text-align:center;display:grid;justify-items:center;gap:1.1rem} .contacto-min h2{font-size:clamp(1.9rem,4.4vw,3.1rem)} .contacto-lead{color:var(--bone-dim);max-width:48ch} .contacto-alt{display:flex;gap:1.6rem;flex-wrap:wrap;justify-content:center;margin-top:.6rem} .contacto-alt a{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase; color:var(--bone-dim);border-bottom:1px solid var(--line-2);padding-bottom:.25em} .contacto-alt a:hover{color:var(--amber);border-color:var(--amber)} .f-mad{text-wrap:balance;font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mist);margin-top:.6rem} /* ============================ MODALES ============================ */ .modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:clamp(.5rem,3vw,2.5rem)} .modal[hidden]{display:none} .modal-back{position:absolute;inset:0;background:rgba(24,3,4,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);animation:mfade .28s ease} @keyframes mfade{from{opacity:0}to{opacity:1}} .modal-box{position:relative;background:var(--ink-2);border:1px solid var(--line-2);width:min(880px,100%); max-height:min(88vh,900px);max-height:min(88svh,900px);display:flex;flex-direction:column;box-shadow:0 40px 90px -40px rgba(0,0,0,.9); animation:mup .34s cubic-bezier(.16,.9,.24,1)} @keyframes mup{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}} .modal-bar{display:flex;align-items:center;gap:1rem;padding:.9rem 1.1rem;border-bottom:1px solid var(--line);flex:none} .modal-crumb{flex:1;font-family:var(--mono);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mist); overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .modal-back-btn{background:transparent;border:1px solid var(--line-2);color:var(--bone);cursor:pointer; font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;padding:.55em .9em; display:inline-flex;align-items:center;gap:.5em;transition:border-color .25s,color .25s} .modal-back-btn:hover{border-color:var(--amber);color:var(--amber)} .modal-back-btn[hidden]{display:none} .modal-x{background:transparent;border:1px solid var(--line-2);color:var(--bone);width:36px;height:36px; font-size:1.4rem;line-height:1;cursor:pointer;flex:none;transition:border-color .25s,color .25s} .modal-x:hover{border-color:var(--oxide);color:var(--oxide)} .modal-scroll{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:clamp(1.3rem,3vw,2.2rem)} .esp-pane[hidden]{display:none} .pane-k{font-family:var(--mono);font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--amber)} .pane-t{font-size:clamp(1.6rem,3.4vw,2.4rem);line-height:1.06;margin:.5rem 0 .8rem} .pane-d{color:var(--bone-dim);font-size:.98rem;line-height:1.6;max-width:66ch} .pane-hint{font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase; color:var(--mist);margin:1.6rem 0 .8rem} .cat-list{display:grid;gap:1px;background:var(--line);border:1px solid var(--line)} .cat-btn{background:var(--ink);border:0;text-align:left;cursor:pointer;padding:1.1rem 1.2rem; display:grid;grid-template-columns:1fr auto;gap:.3rem 1rem;align-items:center;transition:background .25s;color:var(--bone)} .cat-btn:hover{background:var(--panel)} .cb-t{font-family:var(--disp);font-weight:700;font-size:1.1rem;line-height:1.15;grid-column:1} .cb-d{grid-column:1;color:var(--bone-dim);font-size:.9rem;line-height:1.5} .cb-go{grid-column:2;grid-row:1/3;color:var(--amber);font-size:1.1rem;transition:transform .3s} .cat-btn:hover .cb-go{transform:translateX(5px)} .pane-seo{margin-top:1.4rem} .pane-seo a{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase; color:var(--mist);border-bottom:1px solid var(--line-2);padding-bottom:.2em} .pane-seo a:hover{color:var(--amber);border-color:var(--amber)} .pane-cta{margin-top:1.6rem;padding-top:1.3rem;border-top:1px solid var(--line); display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap} .pane-cta p{color:var(--mist);font-size:.9rem;max-width:46ch;margin:0} .modal-form{width:min(620px,100%)} .modal-head{padding:clamp(1.3rem,3vw,2rem) clamp(1.3rem,3vw,2rem) 0} .modal-head h2{font-size:clamp(1.5rem,3vw,2.1rem);margin:.4rem 0 .6rem} .modal-lead{color:var(--bone-dim);font-size:.94rem;line-height:1.55} .modal-form form{padding:clamp(1.3rem,3vw,2rem);display:grid;gap:1rem;overflow-y:auto} .modal-form .modal-x{position:absolute;top:.8rem;right:.8rem;z-index:2} .form-ok{padding:clamp(2rem,5vw,3.4rem);text-align:center;display:grid;gap:1rem;justify-items:center} .ok-mark{width:56px;height:56px;border:1px solid var(--amber);border-radius:50%;display:grid;place-items:center; color:var(--amber);font-size:1.5rem} .form-ok h3{font-size:clamp(1.3rem,2.6vw,1.8rem)} .form-ok p{color:var(--bone-dim);max-width:42ch} body.modal-open{overflow:hidden} @media(max-width:700px){ .modal{padding:0} .modal-box{width:100%;height:100svh;max-height:100svh;height:100dvh;max-height:100dvh;border:0} .modal-bar{padding:.8rem .9rem;position:sticky;top:0;background:var(--ink-2);z-index:3} .pane-cta{flex-direction:column;align-items:stretch} .pane-cta .btn-amber{justify-content:center} } /* ======================= PAGINAS INTERIORES ======================= */ .int-hero{padding-top:clamp(6rem,12vw,9rem);padding-bottom:clamp(2rem,4vw,3rem); background:var(--ink-2);border-bottom:1px solid var(--line)} .int-hero h1{font-size:clamp(2rem,5vw,3.6rem);line-height:1.04;margin:.7rem 0 1rem} .int-crumb{font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase; color:var(--mist);margin-bottom:1.1rem;display:flex;gap:.6em;flex-wrap:wrap;align-items:center} .int-crumb a{color:var(--bone-dim)}.int-crumb a:hover{color:var(--amber)} .int-crumb i{color:var(--mist);font-style:normal;opacity:.85} .int-lead{color:var(--bone-dim);font-size:clamp(1rem,1.5vw,1.14rem);line-height:1.6;max-width:70ch} .int-hero .wrap,.int-body,.int-index .wrap{max-width:var(--max);margin-inline:auto} .legal-body>*{max-width:76ch} .art-head{max-width:none} .art-head>*{max-width:70ch} .int-index{position:sticky;top:56px;z-index:40;background:rgba(38,6,7,.94);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px); border-bottom:1px solid var(--line);padding-block:.7rem} .int-index .wrap{position:relative} .int-index .wrap::after{content:"";position:absolute;right:0;top:0;bottom:0;width:56px;pointer-events:none; background:linear-gradient(90deg,transparent,rgba(38,6,7,.96))} .int-index .wrap{display:flex;align-items:center;gap:1.2rem} .ix-k{font-family:var(--mono);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mist);flex:none} .ix-links{display:flex;gap:1.2rem;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth;padding-right:56px;-webkit-overflow-scrolling:touch} .ix-links::-webkit-scrollbar{display:none} .ix-links a{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase; color:var(--bone-dim);white-space:nowrap;padding-block:.3em} .ix-links a:hover{color:var(--amber)} @media(max-width:700px){.ix-k{display:none}} .int-body{padding-block:clamp(2.4rem,5vw,4rem);display:grid;gap:clamp(2.4rem,5vw,4rem)} .int-cat{scroll-margin-top:110px} .int-cat>h2{font-size:clamp(1.5rem,3vw,2.2rem);line-height:1.08;margin-bottom:.7rem} .int-d{color:var(--bone-dim);max-width:70ch;margin-bottom:1.2rem} .int-cta{margin-top:0;border-top:1px solid var(--line);padding-top:1.6rem} .eq-full-head{display:grid;grid-template-columns:auto 1fr;gap:clamp(1.2rem,3vw,2.2rem);align-items:start;margin-bottom:1.6rem} @media(max-width:640px){.eq-full-head{grid-template-columns:1fr}} .eq-full-head h2{font-size:clamp(1.5rem,3vw,2.2rem);margin-bottom:.5rem} .eq-full .eq-rol{margin-bottom:.4rem} .eq-full .eq-bio{max-width:60ch;margin-top:.8rem} .eq-cols{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)} @media(max-width:760px){.eq-cols{grid-template-columns:1fr}} .eq-cols>div{background:var(--ink-2);padding:1.2rem 1.3rem} .mp-grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:1.4rem} .mp{background:var(--ink-2);padding:1.2rem 1.4rem;display:grid;grid-template-columns:auto 1fr;gap:.3rem 1.2rem} .mp-k{grid-row:1/3;font-family:var(--mono);font-size:1.5rem;color:var(--amber);opacity:.55;line-height:1} .mp h3{font-size:1.2rem;line-height:1.15} .mp p{color:var(--bone-dim);font-size:.94rem;line-height:1.55;max-width:64ch} @media(max-width:560px){.mp{grid-template-columns:1fr}.mp-k{grid-row:auto}} .nav-cta-mob{display:none} .cta-corto{display:none} @media(max-width:980px){ .nav-cta-mob{display:inline-flex;margin-top:.4rem;width:100%;justify-content:center} .nav-cta{order:2;margin-left:auto;font-size:.58rem;padding:.62em .85em;letter-spacing:.1em} .cta-largo{display:none}.cta-corto{display:inline} .navbtn{order:3} header.nav{gap:.55rem} } @media(max-width:400px){.brand span{font-size:.9rem}.nav-cta{font-size:.54rem;padding:.6em .7em}} /* ============ v4 · despachos, blog y legales ============ */ .perfil-mas{text-align:center;margin-top:1.4rem} .perfil-mas a{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase; color:var(--amber);border-bottom:1px solid rgba(199,154,78,.4);padding-bottom:.3em;display:inline-flex;gap:.5em} .perfil-mas a:hover{color:var(--amber-lite)} .int-btns{margin-top:1.6rem} .pz-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:1.2rem} @media(max-width:700px){.pz-grid{grid-template-columns:1fr}} .pz{background:var(--ink-2);padding:1.15rem 1.3rem;display:grid;gap:.4rem} .pz-k{font-family:var(--mono);font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--amber)} .pz p{color:var(--bone-dim);font-size:.93rem;line-height:1.55;margin:0} .esp-grid-int{margin-top:1.4rem} .esp-grid-int .esp-card{min-height:auto} .esp-grid-int .esp-go::after{display:none} .articulo{max-width:68ch} .articulo h2{font-size:clamp(1.3rem,2.4vw,1.75rem);line-height:1.12;margin:2.2rem 0 .8rem} .articulo h2:first-child{margin-top:0} .articulo p{color:var(--bone-dim);font-size:1.02rem;line-height:1.72;margin-bottom:1.1rem} .articulo p:first-of-type{color:var(--bone);font-size:clamp(1.05rem,1.6vw,1.16rem)} .art-nota{margin-top:2.2rem;padding-top:1.2rem;border-top:1px solid var(--line); font-size:.86rem !important;color:var(--mist) !important;font-style:italic} .art-head{max-width:70ch} .posts-idx{background:var(--line)} .posts-idx .post h2{font-size:clamp(1.2rem,2.2vw,1.5rem);line-height:1.15} .posts-idx .post h2 a:hover{color:var(--amber)} .post h3 a:hover{color:var(--amber)} .legal-body>section,.legal-body>p{max-width:76ch} .legal-body .int-cat>h2{font-size:clamp(1.15rem,2vw,1.45rem)} .legal-body .int-d{margin-bottom:.9rem} .legal-aviso{border:1px solid var(--line-2);border-left:3px solid var(--oxide);background:var(--ink-2); padding:.9rem 1.1rem;color:var(--bone-dim);font-size:.9rem} /* retratos reales cuando existan los archivos */ .eq-foto.tiene-foto{padding:0;overflow:hidden;border-color:var(--amber)} .eq-foto.tiene-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 30%} .eq-foto.big.tiene-foto{aspect-ratio:4/5;height:auto} /* ============ pagina de entrega (privada, sin enlazar) ============ */ .ent-hero h1{max-width:18ch} .hc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:1.4rem} @media(max-width:760px){.hc-grid{grid-template-columns:1fr}} .hc{background:var(--ink-2);padding:1rem 1.2rem;display:grid;gap:.25rem;transition:background .25s;position:relative} a.hc:hover{background:var(--panel)} .hc-t{font-family:var(--disp);font-weight:700;font-size:1.05rem;line-height:1.15;color:var(--bone)} .hc-d{color:var(--bone-dim);font-size:.88rem;line-height:1.45} .hc-go{font-family:var(--mono);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);margin-top:.25rem} .pd-list{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:1.4rem} .pd{background:var(--ink-2);padding:1.3rem 1.4rem} .pd-urg{border-left:3px solid var(--oxide)} .pd-h{display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap;margin-bottom:.7rem} .pd-n{font-family:var(--mono);font-size:.78rem;color:var(--amber);letter-spacing:.1em} .pd-h h3{font-size:clamp(1.1rem,2vw,1.35rem);line-height:1.1;flex:1} .pd-tag{font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase; padding:.35em .7em;background:var(--panel);color:var(--bone-dim);white-space:nowrap} .pd-tag.r{background:var(--oxide);color:#fff} .pd p{color:var(--bone-dim);font-size:.94rem;line-height:1.6;max-width:70ch} .pd-como{margin-top:.8rem;font-family:var(--mono);font-size:.78rem !important;line-height:1.65 !important; color:var(--bone) !important;background:var(--ink-3);border-left:2px solid var(--amber);padding:.7rem .9rem} @media(max-width:560px){.pd-h{gap:.5rem}.pd-h h3{flex:1 1 100%}} /* ══════════════════ v5 · SISTEMA DE ANIMACIÓN ══════════════════ */ :root{ --e-out:cubic-bezier(.16,.86,.28,1); --e-soft:cubic-bezier(.33,.9,.35,1); --e-spring:cubic-bezier(.22,1.2,.36,1); } /* ---------- reveal: variantes ---------- */ html.anim .rv{opacity:0;transform:translate3d(0,30px,0); transition:opacity .82s var(--e-out),transform .82s var(--e-out); transition-delay:var(--d,0s)} html.anim .rv.in{opacity:1;transform:none} html.anim .rv-l{opacity:0;transform:translate3d(-32px,0,0); transition:opacity .82s var(--e-out),transform .82s var(--e-out);transition-delay:var(--d,0s)} html.anim .rv-l.in{opacity:1;transform:none} /* revelado con máscara: el texto sube desde detrás de una línea */ .rv-mask{overflow:hidden;display:block} html.anim .rv-mask>*{display:block;transform:translate3d(0,102%,0); transition:transform .95s var(--e-out);transition-delay:var(--d,0s)} html.anim .rv-mask.in>*{transform:none} /* línea que se dibuja */ html.anim .rv-line{transform:scaleX(0);transform-origin:left; transition:transform 1.1s var(--e-out);transition-delay:var(--d,0s)} html.anim .rv-line.in{transform:scaleX(1)} /* escala sutil para tarjetas */ html.anim .rv-pop{opacity:0;transform:translate3d(0,22px,0) scale(.985); transition:opacity .7s var(--e-out),transform .7s var(--e-spring);transition-delay:var(--d,0s)} html.anim .rv-pop.in{opacity:1;transform:none} /* ---------- HERO cinematográfico ---------- */ .hero-min h1{overflow:hidden} .hero-min h1 .ln{display:block;overflow:hidden} html.anim .hero-min h1 .ln>span{display:block;transform:translate3d(0,105%,0); transition:transform 1.05s var(--e-out)} html.anim.loaded .hero-min h1 .ln>span{transform:none} .hero-min h1 .ln:nth-child(1)>span{transition-delay:.02s;transition-duration:.85s} .hero-min h1 .ln:nth-child(2)>span{transition-delay:.13s;transition-duration:.9s} html.anim .hero-tag{opacity:0;transform:translateY(14px);transition:opacity .8s var(--e-out) .05s,transform .8s var(--e-out) .05s} html.anim.loaded .hero-tag{opacity:1;transform:none} html.anim .hero-min .hero-sub{opacity:0;transform:translateY(18px); transition:opacity .8s var(--e-out) .34s,transform .8s var(--e-out) .34s} html.anim.loaded .hero-min .hero-sub{opacity:1;transform:none} html.anim .hero-bg img{transform:scale(1.06);transition:transform 2.6s var(--e-soft) .1s} html.anim.loaded .hero-bg img{transform:scale(1)} html.anim .hero-min::after{content:"";position:absolute;left:var(--pad);bottom:0;height:1px;width:calc(100% - var(--pad)*2); background:linear-gradient(90deg,var(--amber),transparent 70%);opacity:0; transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--e-out) .7s,opacity .5s ease .7s} html.anim.loaded .hero-min::after{opacity:.55;transform:scaleX(1)} html.anim .scrollhint{opacity:0;transition:opacity .8s ease 1.1s} html.anim.loaded .scrollhint{opacity:.75} .scrollhint .bar{animation:hintBar 2.6s var(--e-soft) infinite} @keyframes hintBar{0%,100%{transform:scaleY(.35);opacity:.4}50%{transform:scaleY(1);opacity:1}} /* ---------- barra de progreso de lectura ---------- */ .prog{position:fixed;top:0;left:0;height:2px;width:100%;z-index:70;transform-origin:0 50%; transform:scaleX(0);background:linear-gradient(90deg,var(--amber),var(--amber-lite)); opacity:0;transition:opacity .4s ease;pointer-events:none} header.nav.stuck~.prog,.prog.on{opacity:1} /* ---------- selector de perfil ---------- */ .pcard{overflow:hidden} .pcard::after{content:"";position:absolute;inset:0;background: radial-gradient(420px 180px at var(--mx,50%) var(--my,50%),rgba(199,154,78,.10),transparent 70%); opacity:0;transition:opacity .45s ease;pointer-events:none} .pcard:hover::after{opacity:1} .pcard-on{transform:translateY(6px);transition:opacity .35s ease,transform .45s var(--e-spring)} .pcard[aria-pressed="true"] .pcard-on{transform:none} /* crossfade al cambiar de perfil */ html.anim [data-solo]{animation:perfilIn .5s var(--e-out) both} @keyframes perfilIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}} html.sin-anim-perfil [data-solo]{animation:none} /* ---------- tarjetas de especialidad ---------- */ .esp-card{transition:background .4s var(--e-soft),transform .5s var(--e-out)} .esp-card:hover{transform:translateY(-4px)} .esp-card::after{height:2px;transition:transform .55s var(--e-out)} .esp-k{transition:letter-spacing .5s var(--e-out),color .35s ease} .esp-card:hover .esp-k{letter-spacing:.34em;color:var(--amber-lite)} .esp-card h3{transition:transform .5s var(--e-out)} .esp-card:hover h3{transform:translateX(5px)} .esp-go i{display:inline-block;transition:transform .45s var(--e-spring)} .esp-card:hover .esp-go i{transform:translateX(7px)} /* ---------- por qué Enigma ---------- */ .pq{position:relative} .pq::before{content:"";position:absolute;top:-2px;left:50%;width:0;height:1px;background:var(--amber); transform:translateX(-50%);transition:width .9s var(--e-out);transition-delay:var(--d,0s)} .pq.in::before{width:44px} /* ---------- equipo ---------- */ .eq-card{transition:background .4s ease} .eq-card:hover{background:var(--panel)} .eq-foto{transition:border-color .45s ease,transform .55s var(--e-spring)} .eq-card:hover .eq-foto{border-color:var(--amber);transform:translateY(-3px)} /* ---------- FAQ ---------- */ .acc-item{transition:background .35s ease} .acc-item:hover{background:rgba(255,255,255,.014)} .acc-h .pm{transition:transform .45s var(--e-spring),color .3s ease} .acc-item.open .acc-h .pm{transform:rotate(135deg);color:var(--amber)} .acc-body>div{transition:opacity .45s ease .06s} .acc-item:not(.open) .acc-body>div{opacity:0} .acc-item.open .acc-body>div{opacity:1} .acc-h .q,.cat-name{transition:color .3s ease,transform .45s var(--e-out)} .acc-item.open .acc-h .q{color:var(--amber);transform:translateX(3px)} /* ---------- MODAL: transición entre niveles ---------- */ .modal-box{animation:mBox .42s var(--e-out)} @keyframes mBox{from{opacity:0;transform:translateY(22px) scale(.985)}to{opacity:1;transform:none}} html.anim .esp-pane{animation:paneIn .42s var(--e-out) both} @keyframes paneIn{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}} html.anim .esp-pane.atras{animation:paneBack .42s var(--e-out) both} @keyframes paneBack{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}} .cat-btn{transition:background .3s ease,padding-left .35s var(--e-out)} .cat-btn:hover{padding-left:1.5rem} .cat-btn .cb-go{transition:transform .4s var(--e-spring),opacity .3s ease;opacity:.55} .cat-btn:hover .cb-go{transform:translateX(6px);opacity:1} html.anim .cat-items li{animation:itemIn .5s var(--e-out) both} .cat-items li:nth-child(1){animation-delay:.04s}.cat-items li:nth-child(2){animation-delay:.09s} .cat-items li:nth-child(3){animation-delay:.14s}.cat-items li:nth-child(4){animation-delay:.19s} .cat-items li:nth-child(5){animation-delay:.24s}.cat-items li:nth-child(6){animation-delay:.29s} @keyframes itemIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}} .modal-back{animation:mfade .3s ease} .modal.cerrando .modal-box{animation:mBoxOut .26s ease forwards} .modal.cerrando .modal-back{animation:mfadeOut .26s ease forwards} @keyframes mBoxOut{to{opacity:0;transform:translateY(12px) scale(.99)}} @keyframes mfadeOut{to{opacity:0}} /* ---------- botones ---------- */ .btn-amber,.btn-ghost{position:relative;overflow:hidden} .btn-amber::after{content:"";position:absolute;inset:0;background: linear-gradient(100deg,transparent 20%,rgba(255,255,255,.34),transparent 80%); transform:translateX(-120%);transition:transform .75s var(--e-soft)} .btn-amber:hover::after{transform:translateX(120%)} .btn-amber:active,.btn-ghost:active{transform:translateY(0) scale(.985)} .nav-cta{transition:background .3s ease,transform .35s var(--e-spring)} .nav-cta:hover{transform:translateY(-1px)} /* ---------- enlaces de navegación ---------- */ .nav-links a::after{transition:right .42s var(--e-out)} .pq-more a i,.perfil-mas a i{display:inline-block;transition:transform .4s var(--e-spring)} .pq-more a:hover i,.perfil-mas a:hover i{transform:translateX(5px)} /* ---------- respeto absoluto a reduced-motion ---------- */ @media(prefers-reduced-motion:reduce){ *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important; transition-duration:.001ms !important;scroll-behavior:auto !important} .rv,.rv-l,.rv-pop{opacity:1 !important;transform:none !important} .rv-mask>*{transform:none !important} .hero-min h1 .ln>span{transform:none !important} .hero-min .hero-sub,.hero-tag{opacity:1 !important;transform:none !important} .hero-bg img{transform:none !important} .prog{display:none} } /* ---------- marcadores de foto pendiente ---------- */ .eq-foto.hueco{border:1px dashed rgba(199,154,78,.55);background: repeating-linear-gradient(-45deg,rgba(199,154,78,.05) 0 8px,transparent 8px 16px),var(--ink-3); display:grid;place-items:center;align-content:center;gap:.2rem;text-align:center;padding:.6rem} .hueco-n{font-family:var(--mono);font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:var(--amber)} .hueco-q{font-family:var(--disp);font-weight:700;font-size:1.02rem;color:var(--bone);line-height:1} .hueco-f{font-family:var(--mono);font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mist)} .eq-foto.big.hueco{aspect-ratio:4/5;height:auto} .eq-foto.big .hueco-n{font-size:.78rem}.eq-foto.big .hueco-q{font-size:1.15rem}.eq-foto.big .hueco-f{font-size:.58rem} .foto-tag{position:absolute;right:var(--pad);bottom:1.4rem;z-index:3; font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim); border:1px dashed rgba(199,154,78,.45);padding:.4em .7em;background:rgba(38,6,7,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)} @media(max-width:700px){.foto-tag{display:none}} background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E"); mix-blend-mode:overlay} main,footer{position:relative;z-index:2} header.nav{z-index:60} /* fija siempre: no la pases a position:relative */ /* retícula tenue de expediente en las bandas oscuras */ .band{position:relative;overflow:hidden} .band::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5; background-image:linear-gradient(rgba(199,154,78,.032) 1px,transparent 1px), linear-gradient(90deg,rgba(199,154,78,.032) 1px,transparent 1px); background-size:64px 64px; -webkit-mask-image:radial-gradient(120% 90% at 50% 0,#000 20%,transparent 78%); mask-image:radial-gradient(120% 90% at 50% 0,#000 20%,transparent 78%)} .band>*{position:relative;z-index:1} /* numeración de sección al margen */ .snum{position:absolute;top:clamp(1.6rem,3.4vw,2.8rem);left:var(--pad);z-index:2; font-family:var(--mono);font-size:.7rem;letter-spacing:.3em;color:var(--amber);opacity:.75; display:flex;align-items:center;gap:.7em} .snum::after{content:"";width:clamp(28px,5vw,70px);height:1px;background:linear-gradient(90deg,var(--amber),transparent)} @media(max-width:900px){.snum{font-size:.55rem;letter-spacing:.24em}} /* sello circular giratorio */ .sello{position:absolute;pointer-events:none;opacity:.13;width:clamp(150px,20vw,250px);height:auto} .sello .anillo{transform-origin:60px 60px;animation:selloGira 44s linear infinite} @keyframes selloGira{to{transform:rotate(360deg)}} .sello-tr{top:clamp(1rem,4vw,3rem);right:clamp(1rem,4vw,4rem)} @media(max-width:900px){.int-hero .sello{display:none}} .sello-bl{bottom:clamp(1rem,4vw,3rem);left:clamp(1rem,4vw,4rem)} /* huella dactilar de fondo */ .huella{position:absolute;right:-4%;top:50%;transform:translateY(-50%);width:clamp(260px,34vw,520px); opacity:.055;pointer-events:none} .huella path{fill:none;stroke:var(--amber);stroke-width:1.1;stroke-linecap:round; stroke-dasharray:var(--fl,500);stroke-dashoffset:var(--fl,500)} .huella.in path{transition:stroke-dashoffset 2.6s var(--e-out);transition-delay:var(--fd,0s);stroke-dashoffset:0} @media(max-width:900px){.huella{display:none}} /* cifras reales del catálogo */ .cifras{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line); border:1px solid var(--line);margin-top:clamp(1.6rem,3vw,2.4rem)} @media(max-width:640px){.cifras{grid-template-columns:1fr}} .cifra{background:var(--ink-2);padding:1.1rem 1.2rem;display:grid;gap:.15rem;text-align:center; transition:background .35s ease} .cifra:hover{background:var(--panel)} .cifra b{font-family:var(--disp);font-weight:700;font-size:clamp(1.7rem,3.4vw,2.5rem);color:var(--amber); line-height:1;font-variant-numeric:tabular-nums} .cifra span{font-family:var(--mono);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mist)} /* línea de custodia que cose las secciones */ .costura{position:absolute;left:50%;top:12%;bottom:12%;width:1px;pointer-events:none; background:linear-gradient(180deg,transparent,rgba(199,154,78,.22) 12%,rgba(199,154,78,.22) 88%,transparent); transform:scaleY(0);transform-origin:top;transition:transform 1.6s var(--e-out)} .costura.in{transform:scaleY(1)} .costura::before,.costura::after{content:"";position:absolute;left:50%;width:5px;height:5px;margin-left:-2.5px; border:1px solid var(--amber);border-radius:50%;background:var(--ink)} .costura::before{top:12%}.costura::after{bottom:12%} @media(max-width:900px){.costura{display:none}} /* marca de agua del sector */ .agua{position:absolute;font-family:var(--disp);font-weight:700;color:var(--bone); opacity:.024;font-size:clamp(4rem,11vw,9rem);line-height:1;letter-spacing:-.03em; pointer-events:none;-webkit-user-select:none;user-select:none;white-space:nowrap;z-index:0; -webkit-mask-image:linear-gradient(90deg,#000 0 45%,rgba(0,0,0,.55) 100%);mask-image:linear-gradient(90deg,#000 0 45%,rgba(0,0,0,.55) 100%)} .agua-r{right:0;bottom:.12em; -webkit-mask-image:linear-gradient(270deg,#000 0 45%,rgba(0,0,0,.55) 100%);mask-image:linear-gradient(270deg,#000 0 45%,rgba(0,0,0,.55) 100%)} .agua-l{left:0;top:.06em} @media(max-width:760px){.agua{display:none}} /* borde que se dibuja en las tarjetas grandes */ .esp-card{position:relative;isolation:isolate} .esp-card .marco{position:absolute;inset:0;pointer-events:none;z-index:2} .esp-card .marco line{stroke:var(--amber);stroke-width:1;opacity:0;transition:opacity .3s ease} .esp-card:hover .marco line{opacity:.55} .esp-card .marco .t{transform-origin:left;transform:scaleX(0);transition:transform .5s var(--e-out)} .esp-card .marco .b{transform-origin:right;transform:scaleX(0);transition:transform .5s var(--e-out) .08s} .esp-card:hover .marco .t,.esp-card:hover .marco .b{transform:scaleX(1)} /* esquinas de expediente */ .esq{position:absolute;width:14px;height:14px;border:1px solid var(--amber);opacity:.45;pointer-events:none} .esq-tl{top:-1px;left:-1px;border-right:0;border-bottom:0} .esq-tr{top:-1px;right:-1px;border-left:0;border-bottom:0} .esq-bl{bottom:-1px;left:-1px;border-right:0;border-top:0} .esq-br{bottom:-1px;right:-1px;border-left:0;border-top:0} /* hero: barrido de escáner */ .hero-scan{position:absolute;inset:0;pointer-events:none;z-index:2; background:linear-gradient(180deg,transparent 42%,rgba(199,154,78,.075) 50%,transparent 58%); background-size:100% 240%;animation:scanea 9s var(--e-soft) infinite} @keyframes scanea{0%{background-position:0 -120%}55%,100%{background-position:0 220%}} /* páginas interiores: cabecera con más cuerpo */ .int-hero{position:relative;overflow:hidden} .int-hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.6; background-image:linear-gradient(rgba(199,154,78,.035) 1px,transparent 1px), linear-gradient(90deg,rgba(199,154,78,.035) 1px,transparent 1px); background-size:58px 58px; -webkit-mask-image:radial-gradient(90% 120% at 12% 0,#000,transparent 70%); mask-image:radial-gradient(90% 120% at 12% 0,#000,transparent 70%)} .int-hero::after{content:"";position:absolute;right:-12%;top:-40%;width:60%;height:180%; background:radial-gradient(circle,rgba(199,154,78,.10),transparent 62%);pointer-events:none} .int-hero .wrap{position:relative;z-index:1} .int-cat{position:relative} .int-cat>h2{position:relative;display:inline-block} .int-cat>h2::after{content:"";position:absolute;left:0;right:0;bottom:-.32em;height:1px; background:linear-gradient(90deg,var(--amber),transparent);transform:scaleX(0);transform-origin:left; transition:transform .9s var(--e-out)} .int-cat.in>h2::after,.int-cat:hover>h2::after{transform:scaleX(1)} .cat-items li{position:relative;transition:background .3s ease,padding-left .35s var(--e-out)} .cat-items li:hover{background:var(--panel);padding-left:1.5rem} .cat-items li::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--amber); transform:scaleY(0);transform-origin:top;transition:transform .35s var(--e-out)} .cat-items li:hover::before{transform:scaleY(1)} /* artículos: capitular y ritmo editorial */ .articulo>p:first-of-type::first-letter{font-family:var(--disp);font-weight:700;font-size:2.6em; float:left;line-height:.9;margin:.06em .06em 0 0;color:var(--amber)} .articulo h2{position:relative;padding-left:1.1rem} .articulo h2::before{content:"";position:absolute;left:0;top:.18em;bottom:.18em;width:2px; background:linear-gradient(180deg,var(--amber),transparent)} /* numeracion de categoria en paginas interiores */ .cat-num{display:block;font-family:var(--mono);font-size:.66rem;letter-spacing:.24em; color:var(--amber);opacity:.8;margin-bottom:.5rem} .cat-num::after{content:"";display:inline-block;width:26px;height:1px;background:var(--amber); opacity:.5;margin-left:.7em;vertical-align:middle} .int-hero .sello{opacity:.1} .int-hero .huella{opacity:.05;right:2%} /* ══════════════════ v7 · BUSCADOR DE CASOS ══════════════════ */ .buscacaso{border:1px solid var(--line-2);background: linear-gradient(180deg,var(--panel),var(--ink-2)); padding:clamp(1.4rem,3.2vw,2.4rem);margin-bottom:clamp(2rem,4vw,3rem);position:relative;overflow:hidden} .buscacaso::before{content:"";position:absolute;inset:0;pointer-events:none; background:radial-gradient(700px 260px at 20% 0,rgba(199,154,78,.10),transparent 65%)} .buscacaso>*{position:relative} .bc-head{max-width:60ch;margin-bottom:1.3rem} .bc-k{font-family:var(--mono);font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--amber);margin-bottom:.6rem} .bc-t{font-size:clamp(1.35rem,2.8vw,2rem);line-height:1.08;margin-bottom:.6rem} .bc-d{color:var(--bone-dim);font-size:.96rem;line-height:1.55} .bc-campo{display:flex;align-items:center;gap:.8rem;border:1px solid var(--line-2);background:var(--ink); padding:.25rem 1rem;transition:border-color .3s,box-shadow .3s} .bc-campo:focus-within{border-color:var(--amber);box-shadow:0 0 0 4px rgba(199,154,78,.10)} .bc-campo svg{width:20px;height:20px;color:var(--amber);flex:none} .bc-campo input{flex:1;background:transparent;border:0;color:var(--bone);font-family:var(--body); font-size:1.05rem;padding:1em 0;outline:none;min-width:0} .bc-campo input::placeholder{color:var(--mist)} .bc-campo input::-webkit-search-cancel-button{display:none} .bc-clear{background:transparent;border:0;color:var(--mist);font-size:1.5rem;line-height:1;cursor:pointer;padding:0 .2em} .bc-clear:hover{color:var(--amber)} .bc-ejemplos{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:.9rem} .bc-ejemplos>span{font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mist)} .bc-ejemplos button{background:transparent;border:1px solid var(--line-2);color:var(--bone-dim); font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase; padding:.45em .8em;cursor:pointer;transition:all .25s} .bc-ejemplos button:hover{border-color:var(--amber);color:var(--amber);transform:translateY(-1px)} .bc-res{display:grid;gap:1px;margin-top:0;max-height:0;overflow:hidden;transition:max-height .5s var(--e-out),margin-top .4s ease} .bc-res.con-res{max-height:1400px;margin-top:1.5rem} .bc-n{font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mist); margin-bottom:.9rem;animation:perfilIn .4s var(--e-out) both} .bc-item{background:var(--ink);border:1px solid var(--line);border-left:2px solid var(--line-2); padding:1.1rem 1.3rem;display:grid;gap:.4rem;position:relative; animation:bcIn .45s var(--e-out) both} .bc-item:nth-child(2){animation-delay:.05s}.bc-item:nth-child(3){animation-delay:.1s}.bc-item:nth-child(4){animation-delay:.15s} @keyframes bcIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}} .bc-item+.bc-item{margin-top:.7rem} .bc-top{border-left-color:var(--amber);background:linear-gradient(100deg,rgba(199,154,78,.07),transparent 55%),var(--ink)} .bc-badge{position:absolute;top:-1px;right:-1px;background:var(--amber);color:#2A0708; font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;padding:.35em .7em} .bc-area{font-family:var(--mono);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--amber)} .bc-item h4{font-family:var(--disp);font-weight:700;font-size:clamp(1.1rem,2vw,1.35rem);line-height:1.1;color:var(--bone)} .bc-desc{color:var(--bone-dim);font-size:.93rem;line-height:1.55;max-width:70ch} .bc-inf{font-size:.84rem;color:var(--mist);line-height:1.5} .bc-inf span{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-dim)} .bc-acc{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap;margin-top:.5rem} .bc-link{background:transparent;border:0;color:var(--amber);cursor:pointer;font-family:var(--mono); font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid rgba(199,154,78,.4);padding-bottom:.2em} .bc-link:hover{color:var(--amber-lite)} .bc-vacio{background:var(--ink);border:1px solid var(--line);border-left:2px solid var(--oxide); padding:1.2rem 1.3rem;display:flex;justify-content:space-between;align-items:center;gap:1.2rem;flex-wrap:wrap; animation:bcIn .45s var(--e-out) both} .bc-vacio p{color:var(--bone-dim);font-size:.93rem;max-width:52ch;margin:0} .bc-vacio b{color:var(--bone)} @media(max-width:640px){ .bc-campo input{font-size:1rem} .bc-acc{flex-direction:column;align-items:stretch} .bc-acc .btn-amber{justify-content:center} .bc-vacio{flex-direction:column;align-items:stretch} } /* ══════════════ v8 · IDENTIDAD PROPIA POR PÁGINA ══════════════ */ /* Cada página mantiene la marca (noche + oro) pero cambia su acento, su textura de cabecera y su gesto de entrada. */ html[data-p]{--ac:var(--amber);--ac2:var(--amber-lite);--tint:rgba(199,154,78,.10)} html[data-p="psico"] {--ac:#C79A4E;--ac2:#E6C982;--tint:rgba(199,154,78,.12)} html[data-p="crimi"] {--ac:#CE9070;--ac2:#E8B79A;--tint:rgba(206,144,112,.14)} html[data-p="medleg"] {--ac:#9DB48F;--ac2:#C2D4B2;--tint:rgba(157,180,143,.14)} html[data-p="metodo"] {--ac:#C79A4E;--ac2:#E6C982;--tint:rgba(199,154,78,.16)} html[data-p="equipo"] {--ac:#D8B478;--ac2:#EFD9A8;--tint:rgba(216,180,120,.13)} html[data-p="despachos"]{--ac:#C4A791;--ac2:#E0C7B2;--tint:rgba(196,167,145,.13)} html[data-p="blog"] {--ac:#D9CBA8;--ac2:#EFE6CD;--tint:rgba(217,203,168,.11)} html[data-p="legal"] {--ac:#AB9A8E;--ac2:#CBBDB2;--tint:rgba(171,154,142,.10)} html[data-p="entrega"]{--ac:#C79A4E;--ac2:#E6C982;--tint:rgba(199,154,78,.12)} /* el acento manda en los elementos de cada página interior */ html[data-p] .int-hero .eyebrow,html[data-p] .int-crumb a:hover, html[data-p] .cat-num,html[data-p] .area-k,html[data-p] .pane-k, html[data-p] .it-t,html[data-p] .pz-k,html[data-p] .mp-k,html[data-p] .post-k, html[data-p] .eq-rol,html[data-p] .pq-k,html[data-p] .ix-links a:hover{color:var(--ac)} html[data-p] .int-hero::after{background:radial-gradient(circle,var(--tint),transparent 62%)} html[data-p] .int-cat>h2::after{background:linear-gradient(90deg,var(--ac),transparent)} html[data-p] .cat-items li::before,html[data-p] .articulo h2::before{background:var(--ac)} html[data-p] .hon-list li::before{background:var(--ac)} html[data-p] .int-cta,html[data-p] .area-aviso{border-left-color:var(--ac)} html[data-p] .sello circle,html[data-p] .sello path,html[data-p] .sello text{stroke:var(--ac);fill:none} html[data-p] .sello text{fill:var(--ac);stroke:none} html[data-p] .huella path{stroke:var(--ac)} html[data-p] .eyebrow::before{background:var(--ac)} /* ---- texturas de cabecera, una por página ---- */ .int-hero .tex{position:absolute;inset:0;pointer-events:none;opacity:.5;z-index:0} /* psicología: ondas concéntricas */ html[data-p="psico"] .int-hero .tex{background: repeating-radial-gradient(circle at 88% 18%,transparent 0 26px,rgba(199,154,78,.055) 26px 27px); -webkit-mask-image:linear-gradient(100deg,transparent 35%,#000);mask-image:linear-gradient(100deg,transparent 35%,#000)} /* criminología: retícula de coordenadas con ejes */ html[data-p="crimi"] .int-hero .tex{background: linear-gradient(rgba(206,144,112,.06) 1px,transparent 1px) 0 0/100% 34px, linear-gradient(90deg,rgba(206,144,112,.06) 1px,transparent 1px) 0 0/34px 100%; -webkit-mask-image:radial-gradient(120% 100% at 90% 10%,#000,transparent 70%);mask-image:radial-gradient(120% 100% at 90% 10%,#000,transparent 70%)} /* médico-legal: pauta de historia clínica */ html[data-p="medleg"] .int-hero .tex{background: repeating-linear-gradient(0deg,transparent 0 25px,rgba(157,180,143,.07) 25px 26px); -webkit-mask-image:linear-gradient(80deg,transparent 30%,#000);mask-image:linear-gradient(80deg,transparent 30%,#000)} /* metodología: diagonales de proceso */ html[data-p="metodo"] .int-hero .tex{background: repeating-linear-gradient(-45deg,transparent 0 20px,rgba(199,154,78,.05) 20px 21px); -webkit-mask-image:radial-gradient(90% 120% at 80% 0,#000,transparent 72%);mask-image:radial-gradient(90% 120% at 80% 0,#000,transparent 72%)} /* equipo: trama fina de retrato */ html[data-p="equipo"] .int-hero .tex{background: repeating-linear-gradient(90deg,transparent 0 5px,rgba(216,180,120,.05) 5px 6px); -webkit-mask-image:radial-gradient(80% 100% at 85% 20%,#000,transparent 68%);mask-image:radial-gradient(80% 100% at 85% 20%,#000,transparent 68%)} /* despachos: pauta de expediente */ html[data-p="despachos"] .int-hero .tex{background: repeating-linear-gradient(0deg,transparent 0 31px,rgba(196,167,145,.06) 31px 32px), linear-gradient(90deg,rgba(196,167,145,.10) 0 2px,transparent 2px) 78px 0/100% 100% no-repeat; -webkit-mask-image:linear-gradient(90deg,#000,transparent 75%);mask-image:linear-gradient(90deg,#000,transparent 75%)} /* blog: papel verjurado */ html[data-p="blog"] .int-hero .tex{background: repeating-linear-gradient(0deg,transparent 0 3px,rgba(217,203,168,.035) 3px 4px); -webkit-mask-image:radial-gradient(100% 100% at 20% 0,#000,transparent 75%);mask-image:radial-gradient(100% 100% at 20% 0,#000,transparent 75%)} /* legal: sobrio, sin textura */ html[data-p="legal"] .int-hero .tex{display:none} /* ---- gesto de entrada propio de cada página ---- */ html.anim[data-p="psico"] .int-hero h1{animation:entraPsico .95s var(--e-out) both} @keyframes entraPsico{from{opacity:0;transform:translateY(26px) scale(.985);filter:blur(6px)}to{opacity:1;transform:none;filter:none}} html.anim[data-p="crimi"] .int-hero h1{animation:entraCrimi .8s var(--e-out) both} @keyframes entraCrimi{from{opacity:0;transform:translateX(-30px);letter-spacing:.06em}to{opacity:1;transform:none;letter-spacing:-.015em}} html.anim[data-p="medleg"] .int-hero h1{animation:entraMed .9s var(--e-out) both} @keyframes entraMed{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}} html.anim[data-p="metodo"] .int-hero h1{animation:entraMet .95s var(--e-spring) both} @keyframes entraMet{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}} html.anim[data-p="equipo"] .int-hero h1{animation:entraEq 1s var(--e-out) both} @keyframes entraEq{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}} html.anim[data-p="despachos"] .int-hero h1{animation:entraDes .85s var(--e-out) both} @keyframes entraDes{from{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:none}} html.anim[data-p="blog"] .int-hero h1{animation:entraBlog .9s var(--e-out) both} @keyframes entraBlog{from{opacity:0;transform:translateY(20px) rotate(-.4deg)}to{opacity:1;transform:none}} html[data-p] .int-hero .int-lead{animation:perfilIn .8s var(--e-out) .22s both} html[data-p] .int-crumb{animation:perfilIn .7s var(--e-out) .06s both} /* ---- barra de acento superior por página ---- */ html[data-p] .int-hero::before{border-top:2px solid var(--ac)} .int-hero .barra{position:absolute;top:0;left:0;height:2px;width:100%;z-index:2; background:linear-gradient(90deg,var(--ac),transparent 70%);transform-origin:left; animation:barraEntra 1.2s var(--e-out) both} @keyframes barraEntra{from{transform:scaleX(0)}to{transform:scaleX(1)}} /* ══════════════════ v9 · ELEVACIÓN DE DISEÑO ══════════════════ */ /* transición entre páginas (Chrome 126+ / Safari 18.2+; el resto, corte normal) */ @view-transition{navigation:auto} ::view-transition-old(root){animation:vtOut .22s ease both} ::view-transition-new(root){animation:vtIn .3s var(--e-out) both} @keyframes vtOut{to{opacity:0}} @keyframes vtIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} /* skip link accesible */ .saltar{position:fixed;top:-100px;left:1rem;z-index:300;background:var(--amber);color:#2A0708; font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase; padding:.8em 1.2em;transition:top .25s ease} .saltar:focus{top:1rem} /* ---------- HERO: rejilla con ficha de expediente ---------- */ .hero-inner{display:block;width:100%} .hero-inner>.hero-tag,.hero-inner>h1,.hero-inner>.hero-sub{grid-column:1} .hero-ficha{grid-column:2;grid-row:1/span 3;align-self:center;justify-self:end;width:min(100%,360px)} @media(max-width:1080px){.hero-inner{grid-template-columns:1fr}.hero-ficha{display:none}} .hero-trust{list-style:none;display:flex;gap:clamp(1.2rem,3vw,2.4rem);margin-top:2rem;padding-top:1.4rem; border-top:1px solid rgba(199,154,78,.22);flex-wrap:wrap} .hero-trust li{display:grid;gap:.15rem} .hero-trust b{font-family:var(--disp);font-weight:700;font-size:clamp(1.02rem,1.6vw,1.25rem);color:var(--bone)} .hero-trust span{font-family:var(--mono);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mist)} .hero-ficha{background:linear-gradient(165deg,rgba(59,16,18,.88),rgba(30,4,5,.92)); -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px); border:1px solid rgba(199,154,78,.38);position:relative;padding:0 0 0 20px;color:var(--amber); box-shadow:0 34px 80px -34px rgba(0,0,0,.85),inset 0 1px 0 rgba(242,233,218,.06)} .hf-talad{position:absolute;left:7px;top:0;bottom:0;width:8px;pointer-events:none; background:radial-gradient(circle at 4px 24%,#1E0405 3.4px,rgba(199,154,78,.55) 3.5px 4.5px,transparent 5.5px), radial-gradient(circle at 4px 76%,#1E0405 3.4px,rgba(199,154,78,.55) 3.5px 4.5px,transparent 5.5px)} .hero-ficha::after{content:"";position:absolute;left:15px;top:10px;bottom:10px;width:1px; background:repeating-linear-gradient(180deg,rgba(199,154,78,.32) 0 5px,transparent 5px 11px)} .hero-ficha::before{content:"";position:absolute;left:0;right:0;top:0;height:3px; background:linear-gradient(90deg,var(--amber),transparent 75%)} .hf-cab{display:flex;justify-content:space-between;padding:.85rem 1.2rem;border-bottom:1px dashed rgba(199,154,78,.3); font-family:var(--mono);font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--mist)} .hf-num{color:var(--amber)} .hf-cuerpo{padding:1.1rem 1.2rem;display:grid;gap:.75rem} .hf-linea{display:grid;gap:.2rem} .hf-linea span{font-family:var(--mono);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mist)} .hf-linea b{font-family:var(--body);font-weight:500;font-size:.9rem;color:var(--bone);letter-spacing:.01em} .hf-ok{color:var(--amber-lite) !important} .hf-sello{display:flex;align-items:center;gap:.9rem;padding:.9rem 1.2rem;border-top:1px dashed rgba(199,154,78,.3)} .hf-sello img{width:112px;height:auto;flex:none;filter:drop-shadow(0 3px 8px rgba(0,0,0,.5))} .hf-sello span{font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim);line-height:1.7} html.anim .hero-ficha{opacity:0;transform:translateY(26px)} html.anim.loaded .hero-ficha{opacity:1;transform:none;transition:opacity 1s var(--e-out) .55s,transform 1s var(--e-out) .55s} /* ---------- tarjetas de especialidad con caracter ---------- */ .esp-card{--ca:var(--amber);--ca2:var(--amber-lite);min-height:clamp(280px,30vw,360px);overflow:hidden} .esp-card::after{background:var(--ca)} .esp-fantasma{position:absolute;right:-.06em;bottom:-.22em;font-family:var(--disp);font-weight:700; font-size:clamp(6rem,10vw,9rem);line-height:1;color:var(--ca);opacity:.06;pointer-events:none; transition:opacity .5s ease,transform .6s var(--e-out)} .esp-card:hover .esp-fantasma{opacity:.12;transform:translateY(-6px)} .esp-ico{display:block;width:clamp(40px,4.4vw,52px);color:var(--ca);margin-bottom:.4rem; transition:transform .55s var(--e-spring),color .35s ease} .esp-ico svg{width:100%;height:auto} .esp-card:hover .esp-ico{transform:translateY(-4px) scale(1.06);color:var(--ca2)} .esp-card .esp-k{color:var(--ca)} .esp-card:hover .esp-k{color:var(--ca2);letter-spacing:.3em} .esp-cats{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mist); border-top:1px solid var(--line);padding-top:.7rem;margin-top:.2rem} .esp-card .esp-go{color:var(--ca)} .esp-card:hover{box-shadow:inset 0 0 0 1px rgba(255,255,255,.03),0 24px 60px -34px rgba(0,0,0,.9)} /* ---------- por qué Enigma: tarjetas selladas ---------- */ .pq{border:1px solid var(--line);background:var(--ink-2);padding:clamp(1.5rem,3vw,2.2rem) 1.4rem; transition:transform .5s var(--e-out),border-color .4s ease,background .4s ease;position:relative;overflow:hidden} .pq::after{content:"";position:absolute;inset:auto 0 0 0;height:2px;background:var(--amber); transform:scaleX(0);transform-origin:center;transition:transform .5s var(--e-out)} .pq:hover{transform:translateY(-5px);border-color:var(--line-2);background:var(--panel)} .pq:hover::after{transform:scaleX(1)} .pq-n{display:block;font-family:var(--disp);font-weight:700;font-size:2.6rem;line-height:1;color:var(--amber); opacity:.16;margin-bottom:.6rem;font-variant-numeric:tabular-nums} .pq::before{top:auto} /* ---------- FAQ con caracter de expediente ---------- */ .faq .acc-item{border-left:2px solid transparent;transition:border-color .3s ease,background .35s ease} .faq .acc-item.open{border-left-color:var(--amber);background:var(--ink-2)} .faq .acc-h .qn{transition:color .3s ease} .faq .acc-item.open .qn{color:var(--amber)} .acc-body p{position:relative;padding-left:1rem} .acc-body p::before{content:"";position:absolute;left:0;top:.35em;bottom:.35em;width:2px; background:linear-gradient(180deg,var(--amber),transparent);opacity:.5} /* ---------- contacto con presencia ---------- */ .contactband{overflow:hidden} .contactband .sello{opacity:.1;width:clamp(240px,30vw,420px)} .contacto-min h2{position:relative;display:inline-block} .contacto-min h2::after{content:"";position:absolute;left:15%;right:15%;bottom:-.22em;height:2px; background:linear-gradient(90deg,transparent,var(--amber),transparent);transform:scaleX(0); transition:transform 1s var(--e-out) .3s} .contacto-min h2.in::after{transform:scaleX(1)} /* ---------- otras especialidades (interiores) ---------- */ .otras{margin-top:clamp(1.6rem,3vw,2.4rem)} .otras-k{font-family:var(--mono);font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--mist);margin-bottom:1rem} .otras-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line)} @media(max-width:760px){.otras-grid{grid-template-columns:1fr}} .otra{background:var(--ink-2);padding:1.1rem 1.2rem;display:flex;gap:1rem;align-items:center; transition:background .3s ease,padding-left .35s var(--e-out)} .otra:hover{background:var(--panel);padding-left:1.5rem} .otra-ico{width:38px;flex:none;color:var(--ca,var(--amber))} .otra-ico svg{width:100%;height:auto} .otra b{display:block;font-family:var(--disp);font-size:1.05rem;line-height:1.15;color:var(--bone)} .otra i{display:block;font-style:normal;font-size:.82rem;color:var(--mist);line-height:1.45;margin-top:.2rem} .otra-go{margin-left:auto;color:var(--ca,var(--amber));font-size:1.05rem;transition:transform .4s var(--e-spring)} .otra:hover .otra-go{transform:translateX(5px)} /* ---------- titulares de seccion con revelado de mascara ---------- */ .shead-c h2{overflow:hidden} html.anim .shead-c h2.rv{transform:none;opacity:1;transition:none} html.anim .shead-c h2.rv>span.mask-l{display:block;transform:translateY(105%);transition:transform .9s var(--e-out)} html.anim .shead-c h2.rv.in>span.mask-l{transform:none} /* ---------- buscador: refuerzos ---------- */ .bc-why{font-size:.78rem;color:var(--mist);margin-top:.15rem} .bc-why b{color:var(--amber-lite);font-weight:500} .bc-campo{position:relative} .bc-fake{position:absolute;left:calc(20px + 1.8rem);top:50%;transform:translateY(-50%); color:var(--mist);font-size:1.05rem;pointer-events:none;white-space:nowrap;overflow:hidden;max-width:70%} .bc-fake::after{content:"";display:inline-block;width:1px;height:1.1em;background:var(--amber); vertical-align:text-bottom;margin-left:2px;animation:bcCursor 1s steps(1) infinite} @keyframes bcCursor{50%{opacity:0}} @media(max-width:640px){.hero-trust{gap:1rem}.hero-trust b{font-size:.95rem}} /* ══════════════════ v10 · COMPOSICIÓN CREATIVA ══════════════════ */ /* ---------- HERO: tachado de acta + sello estampado ---------- */ .hero-min h1{position:relative} .hero-min .hero-sub{position:relative} .stampD{position:absolute;left:min(74%,660px);top:-150px;width:clamp(104px,10vw,136px);height:auto; color:var(--amber);transform:rotate(-9deg);pointer-events:none;opacity:.92; filter:drop-shadow(0 4px 16px rgba(0,0,0,.5))} html.anim .stampD{opacity:0;transform:rotate(-16deg) scale(1.7)} html.anim.loaded .stampD{opacity:.92;transform:rotate(-9deg) scale(1); transition:opacity .28s ease 1.62s,transform .38s cubic-bezier(.2,1.6,.35,1) 1.62s} @media(max-width:1080px){.stampD{left:auto;right:2%;top:-150px;width:100px}} @media(max-width:560px){.stampD{display:none}} /* ---------- raíl de expediente lateral (solo escritorio ancho) ---------- */ .rail{position:fixed;left:clamp(.6rem,1.6vw,1.6rem);top:50%;transform:translateY(-50%);z-index:55; display:none;flex-direction:column;gap:1.05rem} @media(min-width:1240px){.rail{display:flex}} .rail a{display:flex;align-items:center;gap:.65rem;text-decoration:none} .rail i{width:9px;height:9px;border:1px solid var(--mist);border-radius:50%;flex:none; transition:all .35s var(--e-out);position:relative} .rail span{font-family:var(--mono);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase; color:var(--bone-dim);opacity:0;transform:translateX(-6px);transition:all .3s var(--e-out);white-space:nowrap} .rail a:hover span{opacity:1;transform:none} .rail a.act i{background:var(--amber);border-color:var(--amber);box-shadow:0 0 0 4px rgba(199,154,78,.18)} .rail a.act span{opacity:1;transform:none;color:var(--amber)} .rail::before{content:"";position:absolute;left:4px;top:-1.4rem;bottom:-1.4rem;width:1px; background:linear-gradient(180deg,transparent,var(--line-2) 20%,var(--line-2) 80%,transparent);z-index:-1} /* ---------- selector: carpetas de expediente con pestaña ---------- */ .perfil-cards{margin-top:2.1rem} .pcard{margin-top:0;overflow:visible;border-radius:0 3px 3px 3px;padding-top:2.2rem} .pcard-tab{position:absolute;top:-26px;left:-1px;height:27px;display:flex;align-items:center; padding:0 1.1rem .1rem;background:var(--ink);border:1px solid var(--line-2);border-bottom:0; font-family:var(--mono);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;color:var(--mist); clip-path:polygon(0 100%,0 18%,7% 0,93% 0,100% 18%,100% 100%);transition:all .3s ease} .pcard[aria-pressed="true"]{border-radius:0 3px 3px 3px} .pcard[aria-pressed="true"] .pcard-tab{background:var(--panel);border-color:var(--amber);color:var(--amber)} .pcard:hover .pcard-tab{color:var(--bone-dim);border-color:var(--line-2)} .pcard[aria-pressed="true"]:hover .pcard-tab{color:var(--amber);border-color:var(--amber)} /* "PERFIL ACTIVO" como sello girado */ .pcard-on{position:absolute;right:.9rem;top:.8rem;justify-self:auto;margin:0;background:transparent; border:1.6px solid var(--amber);color:var(--amber);padding:.34em .7em;transform:rotate(6deg) scale(1.5); border-radius:3px;font-weight:600} .pcard[aria-pressed="true"] .pcard-on{transform:rotate(6deg) scale(1); transition:opacity .22s ease,transform .3s cubic-bezier(.2,1.6,.35,1)} @media(max-width:700px){.perfil-cards{gap:2.2rem}} /* ---------- especialidades: composición escalonada ---------- */ @media(min-width:901px){ .esp-grid{gap:1.4rem;background:transparent;align-items:start} .esp-card{border:1px solid var(--line)} .esp-card:nth-child(2){margin-top:2.6rem} .esp-card:nth-child(3){margin-top:5.2rem} .cifras{margin-top:3.4rem} } /* ---------- "Por qué Enigma": editorial asimétrico ---------- */ @media(min-width:1000px){ .porqueband .wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2.5rem,5vw,5rem);align-items:start} .porqueband .shead-c{text-align:left;max-width:none;margin:0;position:sticky;top:110px} .porqueband .shead-c .eyebrow{justify-content:flex-start} .porqueband .shead-c .eyebrow::before{display:inline-block} .porqueband .shead-c h2{font-size:clamp(2.2rem,3.6vw,3.3rem);line-height:1.04} .porqueband .pq-grid{grid-template-columns:1fr;margin-top:0;gap:1.1rem;position:relative} .porqueband .pq-grid::before{content:"";position:absolute;left:-1.4rem;top:8%;bottom:8%;width:1px; background:linear-gradient(180deg,transparent,var(--amber) 18%,var(--amber) 82%,transparent);opacity:.35} .porqueband .pq{text-align:left;display:grid;grid-template-columns:auto 1fr;gap:.4rem 1.1rem;align-items:start} .porqueband .pq-n{grid-row:1/3;font-size:2.1rem;margin:0;opacity:.28} .porqueband .pq p{margin:0;max-width:none} .porqueband .pq-more{grid-column:1/-1;text-align:left;margin-top:1.4rem} } /* ---------- equipo: fichas físicas con esquina doblada ---------- */ @media(min-width:761px){ .eq-grid{gap:1.8rem;background:transparent} .eq-card{border:1px solid var(--line);box-shadow:0 24px 50px -30px rgba(0,0,0,.85)} .eq-card:nth-child(1){transform:rotate(-1.1deg)} .eq-card:nth-child(2){transform:rotate(.8deg) translateY(10px)} .eq-card:hover{transform:rotate(0) translateY(-4px);transition:transform .5s var(--e-out)} } .eq-card{position:relative} .eq-card::after{content:"";position:absolute;top:0;right:0;width:26px;height:26px; background:linear-gradient(225deg,var(--ink) 0 48%,rgba(199,154,78,.32) 50%,var(--panel) 52%); clip-path:polygon(0 0,100% 0,100% 100%)} /* ---------- cursor personalizado (puntero fino, sin reduced-motion) ---------- */ .cur,.cur2{position:fixed;left:0;top:0;pointer-events:none;z-index:400;border-radius:50%; transform:translate(-50%,-50%);will-change:transform} .cur{width:6px;height:6px;background:var(--amber)} .cur2{width:30px;height:30px;border:1px solid rgba(199,154,78,.45);transition:width .25s ease,height .25s ease,border-color .25s ease} .cur2.go{width:52px;height:52px;border-color:var(--amber)} @media(pointer:coarse){.cur,.cur2{display:none}} /* ══════════════════ v11 · INTERIORES CREATIVAS ══════════════════ */ /* La capa creativa de la home (v10) llevada a las páginas interiores. Regla de la casa: sin html.anim (sin JS o reduced-motion) TODO visible. */ /* ---------- índice pegajoso: la sección visible se marca con el acento ---------- */ .ix-links a{position:relative} .ix-links a.act,html[data-p] .ix-links a.act{color:var(--ac,var(--amber))} .ix-links a.act::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px; background:var(--ac,var(--amber))} /* ---------- especialidades: categorías como piezas de expediente ---------- */ .esp-sec{position:relative} .esp-sec>h2,.esp-sec>.int-d,.esp-sec>.cat-items,.esp-sec>.cat-nota{position:relative;z-index:1} .cat-fant{position:absolute;right:0;top:-.5em;z-index:0;font-family:var(--disp);font-weight:700; font-size:clamp(4.2rem,9vw,8rem);line-height:1;color:var(--ac,var(--amber));opacity:.07; pointer-events:none;-webkit-user-select:none;user-select:none;font-variant-numeric:tabular-nums} .esp-sec .cat-num{position:relative;z-index:1} @media(min-width:1000px){ .esp-sec.zag{margin-left:clamp(3rem,8vw,7.5rem)} .esp-sec.zag::before{content:"";position:absolute;left:0;right:0;top:-1.9rem;height:1px; background:linear-gradient(90deg,var(--ac,var(--amber)),transparent 65%);opacity:.4} } /* ---------- metodología: principios en editorial asimétrico ---------- */ .met-pq{display:grid;gap:1.8rem} /* El numeral decorativo se apoya arriba del todo y el bloque le reserva su altura: antes caía sobre la etiqueta «ANÁLISIS» y la dejaba sucia. */ .met-cita{position:relative;padding-top:clamp(3.2rem,6vw,5rem)} .met-cita>.pq-n{position:absolute;left:-.08em;top:0;font-family:var(--disp);font-weight:700; font-size:clamp(4rem,8vw,6.5rem);line-height:.82;color:var(--ac,var(--amber));opacity:.08; pointer-events:none;font-variant-numeric:tabular-nums} .met-cita .pq-k{position:relative;display:block;font-family:var(--mono);font-size:.7rem; letter-spacing:.3em;text-transform:uppercase;color:var(--ac,var(--amber));margin-bottom:.9rem} .met-cita-t{position:relative;font-family:var(--disp);font-weight:600;letter-spacing:-.015em; font-size:clamp(1.45rem,2.6vw,2.25rem);line-height:1.16;color:var(--bone);max-width:24ch} .met-cita::after{content:"";display:block;width:min(220px,46%);height:2px;margin-top:1.4rem; background:linear-gradient(90deg,var(--ac,var(--amber)),transparent)} html.anim .met-pq-sec .met-cita::after{transform:scaleX(0);transform-origin:left; transition:transform 1.1s var(--e-out) .25s} html.anim .met-pq-sec.in .met-cita::after{transform:scaleX(1)} .met-pq .pq-grid{margin:0;grid-template-columns:1fr;gap:1.1rem;position:relative} .met-pq .pq{text-align:left;display:grid;grid-template-columns:auto 1fr;gap:.35rem 1.1rem;align-items:start} .met-pq .pq::before{display:none} .met-pq .pq-n{grid-row:1/3;font-family:var(--disp);font-weight:700;font-size:2.1rem;line-height:1; color:var(--ac,var(--amber));opacity:.28;margin:0;font-variant-numeric:tabular-nums} .met-pq .pq-k{margin-bottom:.15rem} .met-pq .pq p{margin:0;max-width:none;text-align:left} @media(min-width:1000px){ .met-pq{grid-template-columns:1fr 1.1fr;gap:clamp(2.4rem,5vw,4.5rem);align-items:start} .met-cita{position:sticky;top:120px} .met-pq .pq-grid::before{content:"";position:absolute;left:-1.5rem;top:6%;bottom:6%;width:1px; background:linear-gradient(180deg,transparent,var(--ac,var(--amber)) 18%,var(--ac,var(--amber)) 82%,transparent); opacity:.35} } /* ---------- metodología: el proceso como cadena de custodia ---------- */ .mline{position:relative;margin-top:1.8rem;display:grid;gap:clamp(1.6rem,3.2vw,2.4rem)} .mline .ml-hilo{position:absolute;left:22px;top:10px;bottom:16px;width:1px;background:var(--line-2)} .mline .ml-fill{position:absolute;left:0;top:0;width:100%;height:100%;display:block; background:linear-gradient(180deg,var(--ac,var(--amber)),var(--ac2,var(--amber-lite))); transform-origin:top;transform:scaleY(1)} html.anim .mline .ml-fill{transform:scaleY(0)} .mline .mp{background:transparent;border:0;padding:0 0 0 66px;position:relative; grid-template-columns:1fr;gap:.3rem} .mline .mp-k,html[data-p] .mline .mp-k{position:absolute;left:0;top:-2px;grid-row:auto; width:45px;height:45px;border-radius:50%;border:1px solid var(--line-2);background:var(--ink); display:grid;place-items:center;font-size:.78rem;letter-spacing:.08em;opacity:1;color:var(--mist); transition:border-color .45s ease,color .45s ease,box-shadow .45s ease,background .45s ease} .mline .mp.lit .mp-k,html[data-p] .mline .mp.lit .mp-k{border-color:var(--ac,var(--amber)); color:var(--ac,var(--amber));background:var(--ink-2);box-shadow:0 0 0 6px var(--tint,rgba(199,154,78,.12))} .mline .mp h3{font-size:clamp(1.15rem,2vw,1.35rem)} .mline .mp p{max-width:62ch} /* ---------- equipo: expedientes físicos ---------- */ .eq-full{border:1px solid var(--line);background:var(--ink-2); padding:clamp(1.3rem,3vw,2.2rem);position:relative; box-shadow:0 26px 60px -36px rgba(0,0,0,.85)} .eq-full::after{content:"";position:absolute;top:0;right:0;width:28px;height:28px; background:linear-gradient(225deg,var(--ink) 0 48%,rgba(199,154,78,.32) 50%,var(--panel) 52%); clip-path:polygon(0 0,100% 0,100% 100%)} @media(min-width:1000px){ .eq-full:nth-of-type(odd){--rot:-.6deg} .eq-full:nth-of-type(even){--rot:.6deg} } .eq-full{transform:rotate(var(--rot,0deg));transition:transform .55s var(--e-out)} html.anim .eq-full.rv{transform:translate3d(0,30px,0) rotate(var(--rot,0deg))} html.anim .eq-full.rv.in{transform:rotate(var(--rot,0deg))} .eq-full:hover,html.anim .eq-full.rv.in:hover{transform:rotate(0deg)} .eq-full .hon-list li{padding-left:1.5em} .eq-full .hon-list li::before,html[data-p] .eq-full .hon-list li::before{width:8px;height:8px; top:.42em;background:transparent;border:1px solid var(--ac,var(--amber));transform:rotate(45deg)} html.anim .eq-full .hon-list li{opacity:0;transform:translate3d(-14px,0,0); transition:opacity .6s var(--e-out),transform .6s var(--e-out)} html.anim .eq-full.in .hon-list li{opacity:1;transform:none} html.anim .eq-full.in .hon-list li:nth-child(2){transition-delay:.07s} html.anim .eq-full.in .hon-list li:nth-child(3){transition-delay:.14s} html.anim .eq-full.in .hon-list li:nth-child(4){transition-delay:.21s} html.anim .eq-full.in .hon-list li:nth-child(5){transition-delay:.28s} html.anim .eq-full.in .hon-list li:nth-child(6){transition-delay:.35s} /* ---------- despachos: fichero de servicios F-01…F-05 ---------- */ .desp-grid{display:grid;gap:1.2rem} .desp-ficha{position:relative;border:1px solid var(--line);background:var(--ink-2); padding:clamp(1.3rem,2.6vw,1.9rem);overflow:hidden; transition:transform .5s var(--e-out),background .4s ease,border-color .4s ease,box-shadow .4s ease} .desp-ficha::before{content:"";position:absolute;left:0;top:0;width:100%;height:2px; background:linear-gradient(90deg,var(--ac,var(--amber)),transparent 70%); transform:scaleX(0);transform-origin:left;transition:transform .6s var(--e-out)} .desp-ficha:hover::before{transform:scaleX(1)} .desp-ficha:hover,html.anim .desp-ficha.rv.in:hover{transform:translateY(-5px)} .desp-ficha:hover{background:var(--panel);border-color:var(--line-2); box-shadow:0 24px 55px -32px rgba(0,0,0,.9)} .desp-ficha h2{font-size:clamp(1.2rem,2.2vw,1.55rem);line-height:1.12;margin-bottom:.55rem} .desp-ficha .int-d{margin-bottom:0;font-size:.95rem} .df-k{display:flex;align-items:center;gap:.7em;font-family:var(--mono);font-size:.66rem; letter-spacing:.24em;text-transform:uppercase;color:var(--ac,var(--amber));margin-bottom:.8rem} .df-k::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--ac,var(--amber)),transparent);opacity:.4} @media(min-width:900px){ .desp-grid{grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start} .desp-ficha:nth-child(even){margin-top:2.2rem} } /* ---------- despachos: checklist de expediente ---------- */ .check-list li{padding-left:1.7em} .check-list li::before,html[data-p] .check-list li::before{width:.8em;height:.8em;top:.34em; background:transparent;border:1px solid var(--ac,var(--amber));opacity:.85} /* ---------- blog: archivo escalonado ---------- */ .posts-idx .post{position:relative; transition:transform .5s var(--e-out),background .35s ease,border-color .35s ease} .posts-idx .post::after{content:"";position:absolute;top:0;right:0;width:22px;height:22px; background:linear-gradient(225deg,var(--ink) 0 48%,rgba(199,154,78,.3) 50%,var(--panel) 52%); clip-path:polygon(0 0,100% 0,100% 100%)} .posts-idx .post:hover,html.anim .posts-idx .post.rv.in:hover{transform:translateY(-4px)} .posts-idx .post:hover{background:var(--panel);border-color:var(--line-2)} @media(min-width:901px){ .posts-idx{background:transparent;gap:1.5rem;align-items:start} .posts-idx .post{border:1px solid var(--line)} .posts-idx .post:nth-child(2){margin-top:2.6rem} .posts-idx .post:nth-child(3){margin-top:5.2rem} } /* ---------- blog: lomo de lectura y cierres de sección ---------- */ .articulo{position:relative} .lomo{position:absolute;left:calc(-1*clamp(.8rem,2.2vw,1.5rem));top:.4rem;bottom:.2rem;width:2px; background:var(--line);pointer-events:none} .lomo i{position:absolute;inset:0;display:block; background:linear-gradient(180deg,var(--ac,var(--amber)),var(--ac2,var(--amber-lite))); transform:scaleY(0);transform-origin:top} .articulo h2::after{content:"";position:absolute;left:0;right:0;top:-1.2rem;height:1px; background:linear-gradient(90deg,var(--ac,var(--amber)),transparent 72%);opacity:.5} html.anim .articulo h2::after{transform:scaleX(0);transform-origin:left;transition:transform 1s var(--e-out)} html.anim .articulo h2.in::after{transform:scaleX(1)} /* ---------- reduced-motion: la capa entera se apaga ---------- */ @media(prefers-reduced-motion:reduce){ .eq-full .hon-list li{opacity:1!important;transform:none!important} .ml-fill{transform:scaleY(1)!important} .mline .mp .mp-k{border-color:var(--ac,var(--amber))!important;color:var(--ac,var(--amber))!important} .lomo{display:none} .met-cita::after,.articulo h2::after{transform:scaleX(1)!important} } /* ══════ v13 · logos NM ══════ */ .mark-img{display:block;width:38px;height:38px;object-fit:contain;flex:none; filter:drop-shadow(0 2px 6px rgba(0,0,0,.45));transition:transform .5s var(--e-spring)} .brand:hover .mark-img{transform:rotate(-4deg) scale(1.06)} .f-oficial{display:block;width:min(230px,60%);height:auto;margin-bottom:1rem; filter:drop-shadow(0 4px 14px rgba(0,0,0,.4))} .hf-sello img{width:52px;height:52px;object-fit:contain;flex:none;animation:none} @media(max-width:980px){.mark-img{width:32px;height:32px}} /* nav: monograma oficial solo */ .mark-of{display:block;height:46px;width:auto;object-fit:contain; filter:drop-shadow(0 2px 8px rgba(0,0,0,.45));transition:transform .5s var(--e-spring)} .brand:hover .mark-of{transform:scale(1.05)} header.nav.stuck .mark-of{height:40px;transition:height .3s ease,transform .5s var(--e-spring)} @media(max-width:980px){.mark-of{height:38px}} @media(max-width:400px){.mark-of{height:34px}} /* ══════ reseñas (home) ══════ */ .res-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.6rem);margin-top:clamp(2rem,4vw,3rem)} @media(max-width:900px){.res-grid{grid-template-columns:1fr}} .res-card{background:var(--ink-2);border:1px solid var(--line);padding:clamp(1.4rem,2.6vw,2rem); display:flex;flex-direction:column;gap:.9rem;margin:0;position:relative; transition:transform .5s var(--e-out),border-color .4s ease,background .4s ease} .res-card:nth-child(1){transform:rotate(-.5deg)} .res-card:nth-child(3){transform:rotate(.5deg)} .res-card:hover{transform:translateY(-5px) rotate(0deg);border-color:var(--line-2);background:var(--panel)} .res-card::after{content:"";position:absolute;top:-1px;right:-1px;width:0;height:0; border-style:solid;border-width:0 16px 16px 0;border-color:transparent var(--ink) transparent transparent; filter:drop-shadow(-2px 2px 2px rgba(0,0,0,.3))} .res-q{font-family:var(--disp);font-size:3rem;line-height:.6;color:var(--amber);opacity:.55} .res-card blockquote{color:var(--bone);font-size:.98rem;line-height:1.62;flex:1} .res-card figcaption{display:grid;gap:.2rem;border-top:1px solid var(--line);padding-top:.9rem} .res-card b{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);font-weight:500} .res-card span{color:var(--mist);font-size:.84rem} .res-nota{margin-top:1.2rem;font-family:var(--mono);font-size:.62rem;letter-spacing:.16em; text-transform:uppercase;color:var(--mist);text-align:right} html.anim .res-card.rv-pop{transform:rotate(0deg) translate3d(0,22px,0) scale(.985)} html.anim .res-card.rv-pop.in:nth-child(1){transform:rotate(-.5deg)} html.anim .res-card.rv-pop.in:nth-child(2){transform:none} html.anim .res-card.rv-pop.in:nth-child(3){transform:rotate(.5deg)} html.anim .res-card.rv-pop.in:hover{transform:translateY(-5px) rotate(0deg)} /* ══════ v15 · video del hero + secciones claras + carrusel ══════ */ .hero-bg img,.hero-bg video{position:absolute;inset:0;width:100%;height:112%;object-fit:cover; filter:sepia(.42) hue-rotate(-16deg) saturate(1.4) brightness(.92) contrast(1.05)} .hero-bg video{opacity:0;transition:opacity .8s ease} .hero-bg video.listo{opacity:1} html.anim .hero-bg video{transform:scale(1.06);transition:opacity .8s ease,transform 2.6s var(--e-soft) .1s} html.anim.loaded .hero-bg video{transform:scale(1)} /* ---------- sistema de seccion clara (crema de la referencia) ---------- */ .claro{--ink:#F2E9DA;--ink-2:#FAF3E5;--ink-3:#EBDFCB;--panel:#FFFBF2; --line:#DDCDB4;--line-2:#C9B394;--bone:#331013;--bone-dim:#5C3A34;--mist:#7A564B; --amber:#8A6526;--amber-lite:#6E4F1B;--sh:#D8C7AD; background:var(--ink);color:var(--bone)} .claro::before{opacity:.35} .claro .btn-amber{background:#C79A4E;color:#2A0708} .claro .btn-amber:hover{background:#B8893C} .claro .snum{opacity:.9} .claro .sello{opacity:.16} .claro .costura{background:linear-gradient(180deg,transparent,rgba(138,101,38,.35) 12%,rgba(138,101,38,.35) 88%,transparent)} .claro .res-nota,.claro .pq p{color:var(--bone-dim)} /* ---------- carrusel de reseñas ---------- */ .carrusel{margin-top:clamp(2rem,4vw,3rem);position:relative} .carr-track{display:flex;gap:clamp(1rem,2vw,1.5rem);overflow-x:auto;scroll-snap-type:x mandatory; scrollbar-width:none;padding:.5rem .2rem 1rem;-webkit-overflow-scrolling:touch;cursor:grab} .carr-track::-webkit-scrollbar{display:none} .carr-track:active{cursor:grabbing} .carr-track .res-card{flex:0 0 min(420px,86%);scroll-snap-align:center;margin:0} @media(min-width:1100px){.carr-track .res-card{flex-basis:400px}} .carr-ctrl{display:flex;align-items:center;justify-content:center;gap:1.2rem;margin-top:.6rem} .carr-btn{width:44px;height:44px;border:1px solid var(--line-2);background:var(--panel);color:var(--bone); font-size:1.1rem;cursor:pointer;transition:all .3s;border-radius:0} .carr-btn:hover{border-color:#8A6526;color:#8A6526;transform:translateY(-2px)} .carr-dots{display:flex;gap:.55rem} .carr-dots button{width:9px;height:9px;border-radius:50%;border:1px solid #8A6526;background:transparent; cursor:pointer;padding:0;transition:all .3s} .carr-dots button.on{background:#8A6526;transform:scale(1.25)} .claro .res-card{background:var(--panel);border-color:var(--line)} .claro .res-card::after{border-color:transparent var(--ink) transparent transparent} .claro .res-q{color:#8A6526} .claro .res-card b{color:#8A6526} /* ---------- papel: cuerpo de articulo claro ---------- */ .papel{position:relative} .papel .articulo p{color:#40201c} .papel .articulo p:first-of-type{color:#331013} .papel .art-nota{color:#7A564B !important;border-top-color:var(--line)} .papel .articulo>p:first-of-type::first-letter{color:#8A6526} .papel .articulo h2::before{background:linear-gradient(180deg,#8A6526,transparent)} .papel .pane-cta p{color:#5C3A34} /* buscador: boton whatsapp del resultado */ .bc-wa{display:inline-flex;align-items:center;gap:.55em;background:#1FAF5A;color:#fff;border:0;cursor:pointer; font-family:var(--mono);font-size:.66rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600; padding:.85em 1.2em;transition:background .25s,transform .25s;text-decoration:none} .bc-wa:hover{background:#178F49;transform:translateY(-2px)} .bc-wa svg{width:15px;height:15px;flex:none} .bc-areas{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.8rem;animation:bcIn .45s var(--e-out) both} .bc-areas button{background:transparent;border:1px solid var(--line-2);color:var(--bone-dim);cursor:pointer; font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;padding:.6em 1em;transition:all .25s} .bc-areas button:hover{border-color:var(--amber);color:var(--amber)} /* ---- 3-sep-2026: cambios del documento de las clientas ---- */ .eq-foto.hueco{display:grid;place-items:center;border:1px solid rgba(199,154,78,.35)} .hueco-ini{font-family:var(--disp);font-weight:700;font-size:clamp(1.6rem,3vw,2.4rem);letter-spacing:.14em;color:var(--amber);opacity:.85} .eq-foto.big .hueco-ini{font-size:clamp(2.2rem,4vw,3.2rem)} .art-firma{margin-top:1.1rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--mist)} .art-firma span{color:var(--amber)} .post-fecha{display:block;margin-top:.6rem;font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mist)} .art-lista{margin:0 0 1.2rem 1.2rem;padding:0;color:var(--bone-dim);font-size:1.02rem;line-height:1.7} .art-lista li{margin:.35rem 0;padding-left:.2rem} .art-fuentes{margin-top:2.4rem;padding:1.1rem 1.2rem;border:1px solid var(--line);border-left:2px solid var(--amber)} .art-fuentes-t{font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);margin:0 0 .5rem} .art-fuentes ul{margin:0;padding-left:1.1rem;font-size:.92rem;line-height:1.55;color:var(--bone-dim)} .art-fuentes li{margin:.3rem 0} .art-fuentes a{color:var(--bone);text-decoration:underline;text-decoration-color:rgba(199,154,78,.6);text-underline-offset:3px} @media(min-width:700px){.articulo p,.art-lista li{text-align:justify;hyphens:auto;-webkit-hyphens:auto;text-wrap:pretty}} /* ===== cambios 4/5-sep-2026: WhatsApp visible, CTA flotante, contacto, marca de agua ===== */ .ico-wa{width:18px;height:18px;flex:none} .nav-wa{display:inline-flex;align-items:center;gap:.45rem;color:var(--bone);font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;padding:.55rem .8rem;border:1px solid rgba(255,255,255,.18);border-radius:999px;margin-left:auto;margin-right:.6rem;white-space:nowrap} .nav-wa:hover{border-color:var(--amber);color:var(--amber)} .nav-wa-mob{display:none} @media(max-width:900px){.nav-wa{display:none}.nav-wa-mob{display:inline-flex;margin:.4rem 0 0;justify-content:center}} .hero-wa{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.1rem;color:var(--bone);font-size:.98rem;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.25);padding-bottom:.15rem} .hero-wa .ico-wa{width:20px;height:20px;color:#25D366}.hero-wa:hover{color:var(--amber);border-color:var(--amber)} html.anim .hero-bg img{animation:kenburns 26s ease-in-out infinite alternate} @keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.08)}} .flot-cta{position:fixed;right:14px;bottom:14px;z-index:58;display:flex;flex-direction:column;align-items:flex-end;gap:.5rem} .flot-wa{display:inline-flex;align-items:center;gap:.5rem;background:#25D366;color:#0b1f12;font-weight:700;font-size:.9rem;padding:.7rem 1rem;border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.35);text-decoration:none} .flot-wa .ico-wa{width:22px;height:22px} .flot-val{background:var(--amber);color:var(--ink);font:700 .86rem/1 var(--body);letter-spacing:.02em;padding:.75rem 1rem;border:0;border-radius:999px;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.35)} .flot-val:hover{filter:brightness(1.06)} /* en móvil los dos botones van en una sola fila: tapan la mitad de alto */ @media(max-width:600px){.flot-wa span{display:none}.flot-wa{padding:.72rem;border-radius:50%} .flot-val{font-size:.78rem;padding:.72rem .95rem} .flot-cta{flex-direction:row;align-items:center;gap:.45rem;right:10px;bottom:10px}} body.modal-open .flot-cta{display:none} .form-nota{font-size:.78rem;line-height:1.45;color:rgba(255,255,255,.62);margin:.45rem 0 0} .cifra b.txt{font-size:clamp(1.6rem,3.2vw,2.4rem)} .agua{font-size:clamp(3rem,9vw,7rem)}.agua-r{right:1.5vw} .cont-page{padding-top:1.5rem} .cont-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:2.5rem;align-items:start} @media(max-width:860px){.cont-grid{grid-template-columns:1fr}} .cont-form{border:1px solid var(--line-2);border-radius:4px;padding:clamp(1.2rem,3vw,2rem);background:rgba(0,0,0,.18)} .cont-lado{position:sticky;top:90px} .cont-lado .btn-amber,.cont-lado .btn-wa{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;margin:.6rem 0 1.2rem} .cont-dato{display:flex;flex-direction:column;gap:.15rem;padding:.7rem 0;border-top:1px solid var(--line-2)} .cont-dato span{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--amber)} .cont-dato a{color:var(--bone)}.cont-dato a:hover{color:var(--amber)} .cont-nota{margin-top:1rem;font-size:.9rem;color:rgba(255,255,255,.7)} .cont-faq{margin-top:3.5rem}.cont-faq h2{margin-bottom:1rem} /* ============ sep-2026 · cambios pedidos por la clienta ============ */ /* boton de WhatsApp con icono grande, para CTAs (portada y modal) */ .btn-wa{display:inline-flex;align-items:center;justify-content:center;gap:.65rem; background:#25D366;color:#0b2016;border:1px solid #1FB855;border-radius:2px; font-family:var(--body);font-weight:700;font-size:.95rem;letter-spacing:.01em; padding:.95em 1.6em;cursor:pointer;text-decoration:none; transition:background .25s,transform .25s,box-shadow .25s} .btn-wa:hover{background:#31E27A;transform:translateY(-2px);box-shadow:0 12px 26px -14px rgba(37,211,102,.8)} .btn-wa .ico-wa{width:24px;height:24px;flex:none} .btn-wa.lg{font-size:1rem;padding:1.05em 1.8em} .btn-wa.lg .ico-wa{width:26px;height:26px} .btn-wa.full{width:100%;margin-top:.7rem} /* portada · «¿Hablamos de tu caso?»: valoración + WhatsApp uno al lado del otro */ .contacto-btns{display:flex;gap:.9rem;flex-wrap:wrap;justify-content:center;align-items:stretch} .contacto-btns .btn-amber,.contacto-btns .btn-wa{min-height:56px} @media(max-width:560px){.contacto-btns{flex-direction:column;align-self:stretch;width:min(100%,26rem)} .contacto-btns .btn-amber,.contacto-btns .btn-wa{width:100%}} /* crédito de la fotografía de portada */ .f-credito p{font-size:.68rem;line-height:1.5;color:var(--mist);opacity:.75;margin:0} .f-credito a{border-bottom:1px solid rgba(255,255,255,.2)} .f-credito a:hover{color:var(--amber);border-color:var(--amber)} /* el botón flotante nunca debe tapar la última línea del pie */ .f-credito{padding-bottom:7.5rem} /* carrusel de reseñas: tarjeta entera centrada, con asomo simétrico */ .carr{position:relative} .carr-track{scroll-padding-inline:var(--carr-lado,0px)} .carr-track::before,.carr-track::after{content:"";flex:0 0 var(--carr-lado,0px)} .carr-track .res-card{flex:0 0 var(--carr-ancho,min(420px,86%))} @media(min-width:1100px){.carr-track .res-card{flex-basis:var(--carr-ancho,440px)}} .carr-btn[disabled]{opacity:.32;pointer-events:none} /* la cabecera vuelve a ser fija (ya no ocupa sitio en el flujo): el hero de la portada recupera el hueco que le quitaba */ .hero{padding-top:clamp(8.4rem,calc(8vh + 4.6rem),10.5rem)} /* el enlace a la Política de Privacidad tiene que verse como enlace */ .consent a{color:var(--bone);border-bottom:1px solid var(--amber);padding-bottom:.05em} .consent a:hover{color:var(--amber)} /* dentro del carrusel las tarjetas no van torcidas: estorba al centrado */ .carr-track .res-card{transform:none;scroll-snap-align:center;margin:0} .carr-track .res-card:hover{transform:translateY(-4px)} html.anim .carr-track .res-card{transform:none} /* el asomo de los lados se desvanece: así se lee como «hay más», no como «está cortada» */ .carr-track{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%); mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)} /* título de las FAQ: dos líneas en pantalla ancha, texto corrido en móvil (con
el móvil pegaba las palabras al ocultarlo) */ @media(min-width:761px){h2 .lin{display:block}} /* ===================== pasada anti-IA (15-sep-2026): overrides ===================== */ :root{--mono:var(--body)} /* ══════════════════ v6 · CAPA VISUAL DE EXPEDIENTE ══════════════════ */ /* grano de papel sobre todo el sitio */ body::before{background-image:none !important} .claro::before{display:none} html.anim .rv,html.anim .rv-l,html.anim .rv-pop{opacity:1;transform:none;transition:none} html.anim .rv-mask>*{transform:none;transition:none} html.anim .rv-line{transform:none;transition:none} .rail,.flot-cta,.snum,.agua,.sello,.huella,.marco,.esq,.costura,.hero-trust,.stampD,.esp-fantasma,.esp-ico,.esp-k,.esp-cats, .cat-fant,.cat-num,.pq-n,.hero-grid,.scrollhint,.eyebrow,.pcard-tab,.pcard-on,.hero-tag,.mp-k,.df-k,.post-k,.ml-hilo,.pane-k, .int-hero .tex,.int-hero .barra,.hc-go,.post-go,.pd-n,.mono-badge{display:none !important} .nav-cta,.btn-amber,.btn-ghost,.btn-wa,.modal-x,.bc-clear,.carr-btn{border-radius:4px} .pcard,.esp-card,.pq,.eq-card,.post,.desp-ficha,.pz,.mp,.hc,.pd,.field input,.field select,.field textarea,.bc-campo,.modal-box,.acc-item{border-radius:6px} .nav-wa,.nav-wa-mob{border:0 !important;background:none !important;border-radius:0;padding:0 !important;font-family:var(--body); text-transform:none;letter-spacing:0;font-size:.9rem;text-decoration:underline;text-underline-offset:.25em;color:var(--bone)} .nav-wa svg,.nav-wa-mob svg{display:none} .esp-card,.pcard,.pq,.eq-card,.desp-ficha,.post,.mp,.pz{transform:none !important;box-shadow:none !important;rotate:none} .esp-card:hover,.pcard:hover,.pq:hover,.eq-card:hover,.post:hover{transform:none !important;box-shadow:none !important} .esp-card::before,.esp-card::after,.pq::before,.pq::after{display:none} .faq-list{border-top:1px solid var(--line);margin-top:1.5rem} .faq-flat{border-bottom:1px solid var(--line);padding:1.5rem 0;display:grid;grid-template-columns:minmax(0,19rem) minmax(0,1fr);gap:.5rem 3rem} @media(max-width:820px){.faq-flat{grid-template-columns:1fr}} .faq-flat h3{font-family:var(--disp);font-weight:400;font-size:1.25rem;line-height:1.2;margin:0} .faq-flat p{max-width:64ch;margin:0} .form-alt-wa{display:inline-block;margin-top:.6rem;text-decoration:underline;text-underline-offset:.25em} .contacto-alt a{text-decoration:underline;text-underline-offset:.25em} .hero-min h1 em{font-style:normal;color:inherit} .hero-btns{justify-content:flex-start} body::before{display:none !important} /* --- caja normal en vez de mayúsculas espaciadas (la etiqueta mono era la fórmula) --- */ .nav-links a,.nav-cta,.cta-largo,.cta-corto,.btn-amber,.btn-ghost,.btn-wa,.esp-go,.pq-more a,.pq-more,.bc-ejemplos span,.bc-ejemplos button, .eq-rol,.eq-reg,.pq-k,.f-h,.cont-dato span,.ix-k,.otras-k,.pz-k,.int-crumb,.modal-crumb,.pgk,.pd-tag,.post-fecha,.art-firma, .form-alt,.consent,.field label,.acc-h,.cb-t,.it-t,.modal-back-btn,.pane-seo a,.hero-wa,.contacto-alt a,.f-bottom,.f-col a,.int-btns,.hc-t,.hc-d{ text-transform:none;letter-spacing:0} .nav-links a{font-size:.92rem} .nav-cta,.btn-amber,.btn-ghost,.btn-wa{font-size:.98rem;letter-spacing:0} .esp-go,.pq-more a{font-size:1rem;text-decoration:underline;text-underline-offset:.25em} .eq-rol{font-size:.95rem} .eq-reg{font-size:.88rem} .pq-k{font-size:1rem;font-family:var(--disp);font-weight:700} .bc-ejemplos button{border:0;background:none;padding:0;text-decoration:underline;text-underline-offset:.25em;font-size:.95rem} .bc-ejemplos span{font-size:.95rem} .bc-k{display:none !important} /* retratos sin máscara redonda, tarjeta de equipo sin adorno de esquina */ .eq-foto,.eq-foto img{border-radius:4px !important} .eq-card::before,.eq-card::after{display:none !important} .eq-foto{width:min(100%,220px);aspect-ratio:4/5;margin-inline:auto} .eq-foto img{width:100%;height:100%;object-fit:cover} /* titular en una sola frase que parte donde quiera */ .hero-min h1 .ln{max-width:14ch} .hero-btns .btn-amber.lg{font-size:1.06rem;padding:1.05em 1.9em}