/* Colores de marca: --marca tomado del logo oficial. --oro es el acento propuesto. */
:root{
  --marca:#233160; --marca-osc:#18224A; --oro:#BFA067; --oro-texto:#8A6D33;
  --tinta:#1B2238; --gris:#5E6577; --linea:#E3E0D8; --porcelana:#FAFAF7; --blanco:#FFFFFF;
  --serif:"Cormorant Garamond", Garamond, Georgia, serif;
  --sans:"Jost", "Avenir Next", Avenir, "Century Gothic", system-ui, sans-serif;
  --grano:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%27240%27%20height%3D%27240%27%3E%3Cfilter%20id%3D%27n%27%3E%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%270.85%27%20numOctaves%3D%273%27%20stitchTiles%3D%27stitch%27/%3E%3CfeColorMatrix%20values%3D%270%200%200%200%200.14%200%200%200%200%200.19%200%200%200%200%200.37%200%200%200%200.045%200%27/%3E%3C/filter%3E%3Crect%20width%3D%27240%27%20height%3D%27240%27%20filter%3D%27url%28%23n%29%27/%3E%3C/svg%3E");
  --damasco:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%2796%27%20height%3D%2796%27%20viewBox%3D%270%200%2096%2096%27%3E%3Cg%20fill%3D%27none%27%20stroke%3D%27rgba%28196%2C164%2C104%2C.10%29%27%20stroke-width%3D%271%27%3E%0A%3Cpath%20d%3D%27M48%2010c8%2010%208%2020%200%2028c-8-8-8-18%200-28z%27/%3E%3Cpath%20d%3D%27M48%2086c8-10%208-20%200-28c-8%208-8%2018%200%2028z%27/%3E%0A%3Cpath%20d%3D%27M10%2048c10-8%2020-8%2028%200c-8%208-18%208-28%200z%27/%3E%3Cpath%20d%3D%27M86%2048c-10-8-20-8-28%200c8%208%2018%208%2028%200z%27/%3E%0A%3Ccircle%20cx%3D%2748%27%20cy%3D%2748%27%20r%3D%275%27/%3E%3Cpath%20d%3D%27M38%2038q10%204%2020%200M38%2058q10-4%2020%200%27/%3E%3C/g%3E%0A%3Cg%20fill%3D%27rgba%28255%2C255%2C255%2C.05%29%27%3E%3Ccircle%20cx%3D%270%27%20cy%3D%270%27%20r%3D%273%27/%3E%3Ccircle%20cx%3D%2796%27%20cy%3D%270%27%20r%3D%273%27/%3E%3Ccircle%20cx%3D%270%27%20cy%3D%2796%27%20r%3D%273%27/%3E%3Ccircle%20cx%3D%2796%27%20cy%3D%2796%27%20r%3D%273%27/%3E%0A%3Cpath%20d%3D%27M0%2020q8%204%200%208zM96%2020q-8%204%200%208zM20%200q4%208%208%200zM20%2096q4-8%208%200z%27/%3E%3C/g%3E%3C/svg%3E");
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;color:var(--tinta);font-family:var(--sans);font-size:17px;line-height:1.65;
  background-color:var(--porcelana);
  background-image:var(--grano),repeating-linear-gradient(0deg,rgba(35,49,96,.022) 0 1px,transparent 1px 5px)}
a{color:var(--marca)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--oro);outline-offset:3px}
img,svg{max-width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.15;margin:0;color:var(--marca)}
h2{font-size:clamp(2rem,3.6vw,2.9rem)}
p{margin:.4rem 0 1rem;max-width:64ch}
.btn{display:inline-block;padding:13px 26px;font-family:var(--sans);font-weight:500;font-size:.95rem;letter-spacing:.02em;text-decoration:none;border:1px solid var(--marca);background:var(--marca);color:#fff}
.btn.oro{background:var(--oro);border-color:var(--oro);color:var(--marca-osc)}
.btn.linea{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn.claro{background:transparent;color:var(--marca)}

/* Filete ornamental */
.filete{display:flex;align-items:center;gap:14px;color:var(--oro);margin:14px 0 22px}
.filete::before,.filete::after{content:"";height:1px;background:currentColor;flex:1;max-width:90px}
.filete svg{width:18px;height:18px}
.centro{text-align:center}.centro p{margin-left:auto;margin-right:auto}.centro .filete{justify-content:center}

/* Barra superior */
.topbar{background:var(--marca-osc);color:rgba(255,255,255,.85);font-size:.84rem;letter-spacing:.01em}
.topbar .wrap{display:flex;flex-wrap:wrap;gap:6px 28px;justify-content:space-between;padding-top:9px;padding-bottom:9px}
.topbar a{color:#fff;text-decoration:none}

/* Encabezado */
header.main{background:rgba(250,250,247,.96);border-bottom:1px solid var(--linea);position:sticky;top:0;z-index:20;backdrop-filter:blur(6px)}
header.main .wrap{display:flex;align-items:center;gap:30px;padding-top:16px;padding-bottom:16px}
.logo{display:block;margin-right:auto}
.logo img{height:36px;width:auto;display:block}
nav.menu{display:flex;gap:28px;font-size:.95rem}
nav.menu a{text-decoration:none;color:var(--tinta);padding:4px 0;border-bottom:1px solid transparent}
nav.menu a:hover{border-color:var(--oro)}
@media (max-width:980px){nav.menu{display:none}header.main .btn{padding:10px 14px;white-space:nowrap;font-size:.88rem}}
@media (max-width:420px){.logo img{height:28px}}

/* Hero en damasco */
.hero{background-color:var(--marca);background-image:var(--damasco),radial-gradient(ellipse at 75% 40%,rgba(255,255,255,.08),transparent 60%);color:#fff;position:relative}
.hero::after{content:"";position:absolute;inset:14px;border:1px solid rgba(191,160,103,.45);pointer-events:none}
.hero .wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:56px;align-items:center;padding-top:96px;padding-bottom:104px;position:relative;z-index:1}
.hero .ref{font-family:var(--serif);font-style:italic;color:var(--oro);font-size:1.25rem}
.hero h1{color:#fff;font-size:clamp(2.6rem,5.4vw,4.6rem);margin:14px 0 8px;font-weight:500;letter-spacing:-.005em}
.hero p{color:rgba(255,255,255,.82);font-size:1.12rem}
.hero .acciones{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero .escudo{width:100%;max-width:330px;justify-self:center;filter:drop-shadow(0 18px 30px rgba(0,0,0,.25))}
@media (max-width:880px){.hero .wrap{grid-template-columns:1fr;padding-top:64px;padding-bottom:72px}.hero .escudo{max-width:220px;order:-1}}

/* Franja de atención */
.atencion{background:var(--blanco);border-bottom:1px solid var(--linea)}
.atencion .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.atencion div{padding:22px 24px;border-right:1px solid var(--linea)}
.atencion div:last-child{border-right:none}
.atencion small{display:block;color:var(--oro-texto);font-family:var(--serif);font-style:italic;font-size:1.02rem}
.atencion b{font-weight:500}
.estado{display:inline-flex;align-items:center;gap:8px}
.estado i{width:8px;height:8px;border-radius:50%;background:#9AA0AE}
.estado.si i{background:#2E8B57}
@media (max-width:900px){.atencion .wrap{grid-template-columns:1fr 1fr}.atencion div:nth-child(2){border-right:none}.atencion div:nth-child(-n+2){border-bottom:1px solid var(--linea)}}
@media (max-width:520px){.atencion .wrap{grid-template-columns:1fr}.atencion div{border-right:none;border-bottom:1px solid var(--linea)}}

section.b{padding:96px 0}
.min>*{min-width:0}

/* Valores con escudos */
.valores{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;margin-top:40px}
.valor{text-align:center}
.valor svg{width:96px;height:auto;margin-bottom:14px}
.valor h3{font-size:1.6rem;margin-bottom:6px}
.valor p{color:var(--gris);margin:0 auto;max-width:32ch}
@media (max-width:820px){.valores{grid-template-columns:1fr;gap:36px}}

/* Trámites */
.tramites-sec{background:var(--blanco)}
.tramites{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--linea);border-left:1px solid var(--linea);margin-top:44px}
.tram{padding:34px 30px;border-right:1px solid var(--linea);border-bottom:1px solid var(--linea);text-decoration:none;color:var(--tinta);display:flex;flex-direction:column;gap:10px;background:var(--blanco)}
.tram:hover{background:var(--porcelana)}
.tram:hover h3{text-decoration:underline;text-decoration-color:var(--oro);text-underline-offset:6px}
.tram svg{width:34px;height:34px;color:var(--oro-texto)}
.tram h3{font-size:1.65rem}
.tram p{margin:0;color:var(--gris);font-size:.95rem}
.tram span{margin-top:auto;padding-top:10px;font-size:.88rem;color:var(--marca);font-weight:500}
@media (max-width:900px){.tramites{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.tramites{grid-template-columns:1fr}}

/* Proceso */
.proceso{display:grid;grid-template-columns:repeat(4,1fr);gap:36px;margin-top:48px}
.paso{border-top:1px solid var(--oro);padding-top:20px}
.paso .num{font-family:var(--serif);font-size:2.4rem;color:var(--oro-texto);line-height:1}
.paso h3{font-size:1.45rem;margin:8px 0 6px}
.paso p{margin:0;color:var(--gris);font-size:.95rem}
@media (max-width:900px){.proceso{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.proceso{grid-template-columns:1fr}}

/* Servicios en línea en damasco */
.linea-sec{background-color:var(--marca-osc);background-image:var(--damasco);color:#fff}
.linea-sec h2{color:#fff}
.linea-sec .intro{color:rgba(255,255,255,.8)}
.servicios{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(191,160,103,.35);border:1px solid rgba(191,160,103,.35);margin-top:40px}
.servicios a{background:var(--marca-osc);padding:32px 26px;text-decoration:none;color:#fff;display:flex;flex-direction:column;gap:10px}
.servicios a:hover{background:#1f2b58}
.servicios svg{width:30px;height:30px;color:var(--oro)}
.servicios h3{color:#fff;font-size:1.5rem}
.servicios p{margin:0;color:rgba(255,255,255,.75);font-size:.94rem}
@media (max-width:900px){.servicios{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.servicios{grid-template-columns:1fr}}

/* Notaría */
.notaria{display:grid;grid-template-columns:380px 1fr;gap:64px;align-items:center}
.marco{padding:14px;border:1px solid var(--oro);background:var(--blanco)}
.marco div{aspect-ratio:4/5;background:var(--porcelana);background-image:var(--grano);border:1px solid var(--linea);display:grid;place-items:center;color:var(--gris);text-align:center;padding:20px;font-size:.92rem}
.notaria blockquote{font-family:var(--serif);font-style:italic;font-size:clamp(1.6rem,2.6vw,2.1rem);line-height:1.3;color:var(--marca);margin:0 0 22px}
.firma{font-family:var(--serif);font-size:1.35rem;color:var(--marca)}
@media (max-width:880px){.notaria{grid-template-columns:1fr}.marco{max-width:320px}}

/* Servicios especiales */
.especiales-sec{background:var(--blanco)}
.especiales{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:start}
.especiales ul{list-style:none;margin:0;padding:0}
.especiales li{display:grid;grid-template-columns:44px 1fr;gap:16px;padding:20px 0;border-bottom:1px solid var(--linea)}
.especiales li svg{width:44px;height:auto}
.especiales li h3{font-size:1.4rem}
.especiales li p{margin:2px 0 0;color:var(--gris);font-size:.95rem}
.cita-box{border:1px solid var(--oro);padding:36px;background:var(--porcelana);background-image:var(--grano);position:relative}
.cita-box::before{content:"";position:absolute;inset:6px;border:1px solid var(--linea);pointer-events:none}
@media (max-width:880px){.especiales{grid-template-columns:1fr}}

/* Reseñas */
.resenas{display:grid;grid-template-columns:280px 1fr;gap:56px;align-items:start}
.nota{font-family:var(--serif);font-size:5rem;line-height:.9;color:var(--marca)}
.estrellas{color:var(--oro);letter-spacing:4px;font-size:1.2rem}
.citas{display:grid;grid-template-columns:1fr 1fr 1fr;gap:28px}
.citas figure{margin:0;padding-top:18px;border-top:1px solid var(--oro)}
.citas blockquote{margin:0;font-family:var(--serif);font-size:1.25rem;line-height:1.35;color:var(--tinta)}
.citas figcaption{font-size:.86rem;color:var(--gris);margin-top:12px}
@media (max-width:900px){.resenas,.citas{grid-template-columns:1fr}}

/* Noticias */
.noticias{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:40px}
.noticias article{background:var(--blanco);border:1px solid var(--linea)}
.noticias .img{aspect-ratio:16/10;background-color:var(--marca);background-image:var(--damasco);display:grid;place-items:center}
.noticias .img svg{width:78px;opacity:.9}
.noticias .txt{padding:24px}
.noticias time{font-family:var(--serif);font-style:italic;color:var(--oro-texto)}
.noticias h3{font-size:1.45rem;margin:6px 0 8px}
.noticias p{color:var(--gris);font-size:.94rem;margin:0}
@media (max-width:900px){.noticias{grid-template-columns:1fr}}

/* Institucional */
.inst-sec{background:var(--blanco)}
.tres{display:grid;grid-template-columns:1fr 1fr 1fr;gap:48px}
.tres h3{font-size:1.65rem;margin-bottom:10px}
.tres ul{list-style:none;margin:0;padding:0}
.tres li{border-bottom:1px solid var(--linea)}
.tres li a{display:block;padding:11px 0;text-decoration:none;color:var(--tinta);font-size:.96rem}
.tres li a:hover{color:var(--marca);padding-left:6px}
.tres time{display:block;font-size:.84rem;color:var(--oro-texto);font-family:var(--serif);font-style:italic;padding-top:10px}
.tres li.edicto a{padding-top:0}
details{border-bottom:1px solid var(--linea);padding:12px 0}
summary{cursor:pointer;font-size:.96rem;font-weight:500;list-style:none;display:flex;justify-content:space-between;gap:14px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--oro-texto);font-family:var(--serif);font-size:1.4rem;line-height:1}
details[open] summary::after{content:"–"}
details p{font-size:.93rem;color:var(--gris);margin:8px 0 4px}
@media (max-width:900px){.tres{grid-template-columns:1fr}}

/* Visítenos */
.visita{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--linea);background:var(--blanco)}
.mapa{min-height:360px;background-color:#EEF0F4;background-image:linear-gradient(90deg,transparent 47%,#fff 47% 50%,transparent 50%),linear-gradient(20deg,transparent 60%,#fff 60% 62%,transparent 62%),linear-gradient(0deg,transparent 35%,#fff 35% 38%,transparent 38%);display:grid;place-items:center}
.pin{background:var(--marca);color:#fff;padding:10px 18px;font-size:.9rem}
.visita .datos{padding:44px}
.visita table{width:100%;border-collapse:collapse;margin:16px 0 24px}
.visita td{padding:12px 0;border-bottom:1px solid var(--linea);vertical-align:top}
.visita td:last-child{text-align:right}
@media (max-width:880px){.visita{grid-template-columns:1fr}.visita .datos{padding:30px}}

.entidades{display:flex;flex-wrap:wrap;gap:16px 44px;align-items:center;justify-content:center;padding:44px 0;border-top:1px solid var(--linea)}
.entidades span{font-family:var(--serif);font-size:1.15rem;color:var(--gris)}

footer{background-color:var(--marca-osc);background-image:var(--damasco);color:rgba(255,255,255,.8);padding:72px 0 40px;font-size:.93rem}
footer .top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
footer .marca img{height:34px;width:auto;margin-bottom:18px}
footer .marca svg{width:90px;display:block;margin-bottom:10px}
footer h3{color:var(--oro);font-size:1.3rem;margin-bottom:12px}
footer a{color:rgba(255,255,255,.85);text-decoration:none}
footer a:hover{color:#fff}
footer ul{list-style:none;margin:0;padding:0}
footer li{margin-bottom:8px}
footer .legal{border-top:1px solid rgba(191,160,103,.35);margin-top:48px;padding-top:22px;display:flex;flex-wrap:wrap;gap:10px 28px;font-size:.84rem}
@media (max-width:880px){footer .top{grid-template-columns:1fr 1fr}}
@media (max-width:520px){footer .top{grid-template-columns:1fr}}

.wa{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));width:56px;height:56px;border-radius:50%;background:#1F8A4C;display:grid;place-items:center;box-shadow:0 8px 20px rgba(0,0,0,.25);z-index:30;border:2px solid var(--oro)}
.wa svg{width:28px;height:28px}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}

/* ===== Elementos de época: Europa, primera mitad del siglo XX ===== */
:root{--lacre:#7A1F2B;--marfil:#F3EEE2;--sepia:grayscale(1) sepia(.45) contrast(1.05) brightness(.97)}
body{background-color:#F7F4EC;background-image:var(--grano),radial-gradient(circle at 12% 18%,rgba(140,110,60,.05),transparent 28%),radial-gradient(circle at 88% 64%,rgba(140,110,60,.045),transparent 30%),repeating-linear-gradient(0deg,rgba(35,49,96,.022) 0 1px,transparent 1px 5px)}
header.main{border-bottom:3px double var(--oro);background:rgba(247,244,236,.97)}
.tramites-sec,.especiales-sec,.inst-sec{background:#FCFAF5}
.hero{background-image:linear-gradient(rgba(35,49,96,.90),rgba(24,34,74,.94)),url("https://images.unsplash.com/photo-1450101499163-c8848c66ca85?auto=format&fit=crop&w=1600&q=70"),var(--damasco);background-size:cover,cover,auto;background-position:center,center 30%,0 0;background-blend-mode:normal,luminosity,normal}
.hero .wrap{padding-left:56px;padding-right:56px}
.esquina{position:absolute;width:74px;height:74px;color:var(--oro);z-index:2;pointer-events:none}
.esquina.tl{top:22px;left:22px}.esquina.tr{top:22px;right:22px;transform:scaleX(-1)}
.esquina.bl{bottom:22px;left:22px;transform:scaleY(-1)}.esquina.br{bottom:22px;right:22px;transform:scale(-1)}
.filete .flor{font-family:var(--serif);font-size:1.5rem;line-height:1;color:var(--oro)}
/* Grabados sepia en trámites */
.tram{padding:0;gap:0}
.tram .grabado{aspect-ratio:16/9;background-color:#E9E2D2;background-size:cover;background-position:center;filter:var(--sepia);border-bottom:1px solid var(--linea);position:relative}
.tram .cuerpo{padding:26px 28px 30px;display:flex;flex-direction:column;gap:10px;flex:1}
.tram:hover .grabado{filter:grayscale(.3) sepia(.25)}
/* Camafeo oval */
.proc-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:56px;align-items:center}
.proc-grid .proceso{grid-template-columns:1fr 1fr;margin-top:28px}
.camafeo{position:relative;justify-self:center;width:100%;max-width:340px;aspect-ratio:4/5;padding:14px;border-radius:50%;border:1px solid var(--oro);background:var(--marfil)}
.camafeo::before{content:"";position:absolute;inset:6px;border-radius:50%;border:3px double var(--oro)}
.camafeo div{background-color:#E9E2D2;width:100%;height:100%;border-radius:50%;background-size:cover;background-position:center;filter:var(--sepia)}
.camafeo .cinta{position:absolute;left:50%;bottom:-18px;transform:translateX(-50%);width:76px}
/* Retrato oval del notario */
.marco{border-radius:50% / 44%;padding:16px;background:var(--marfil);position:relative}
.marco::before{content:"";position:absolute;inset:7px;border-radius:50% / 44%;border:3px double var(--oro);pointer-events:none}
.marco div{border-radius:50% / 44%;background-image:linear-gradient(rgba(243,238,226,.25),rgba(243,238,226,.25)),url("https://images.unsplash.com/photo-1450101499163-c8848c66ca85?auto=format&fit=crop&w=1600&q=70");background-size:cover;background-position:center;filter:var(--sepia);color:transparent}
.marco-pie{text-align:center;font-family:var(--serif);font-style:italic;color:var(--gris);margin-top:14px}
.notaria .capital::first-letter{font-family:var(--serif);float:left;font-size:4.2rem;line-height:.8;padding:6px 10px 0 0;color:var(--lacre)}
/* Sello de lacre */
.lacre{position:absolute;width:92px;right:-26px;top:-30px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.25));transform:rotate(-8deg)}
.cita-box{margin-top:30px}
/* Timbres perforados en noticias */
.noticias article{background:transparent;border:none}
.timbre{padding:12px;background:#EDE4CF;-webkit-mask:linear-gradient(#000 0 0) center/calc(100% - 12px) calc(100% - 12px) no-repeat,radial-gradient(circle at 6px 6px,transparent 4px,#000 4.5px) -6px -6px/12px 12px;mask:linear-gradient(#000 0 0) center/calc(100% - 12px) calc(100% - 12px) no-repeat,radial-gradient(circle at 6px 6px,transparent 4px,#000 4.5px) -6px -6px/12px 12px}
.noticias .img{background-color:#E7EBF2;position:relative;background-size:cover;background-position:center;aspect-ratio:4/3;outline:1px solid rgba(138,109,51,.5);outline-offset:-8px}
.noticias .img.foto{filter:var(--sepia)}
.noticias .img svg{position:absolute;right:10px;bottom:10px;width:46px}
.noticias .txt{padding:18px 6px 0;text-align:center}
/* Tarjetas en línea como boletos de época */
.servicios a{position:relative}
.servicios a::after{content:"";position:absolute;inset:8px;border:1px solid rgba(191,160,103,.28);pointer-events:none}
/* Viñeta de papel en la sección de valores */
.valores .valor{padding:10px 10px 0}
@media (max-width:880px){.proc-grid{grid-template-columns:1fr}.camafeo{max-width:260px}.hero .wrap{padding-left:34px;padding-right:34px}.esquina{width:48px;height:48px}.lacre{right:-8px;width:74px}}
@media (max-width:520px){.proc-grid .proceso{grid-template-columns:1fr}}

/* ===== Versión moderna premium: paloseco, tecnología, fotos sin máscaras ===== */
:root{--serif:"Jost","Avenir Next",Avenir,system-ui,sans-serif;--sans:"Jost","Avenir Next",Avenir,system-ui,sans-serif;--oro:#C2A36B;--oro-texto:#8A6D33;--cian:#2FB8E6;--fondo2:#F5F7FB;--r:14px}
body{background:#F5F7FB;background-image:none;font-weight:400}
h1,h2,h3{font-family:var(--sans);font-weight:500;letter-spacing:-.02em}
h2{font-size:clamp(1.9rem,3.2vw,2.6rem)}
.tramites-sec,.especiales-sec,.inst-sec{background:#fff}
header.main{border-bottom:1px solid #E6E9F0;background:rgba(255,255,255,.9);backdrop-filter:blur(12px)}
.btn{border-radius:10px;font-weight:500}
.topbar{background:#0F1733}
/* filete: barra simple */
.filete{gap:0;margin:14px 0 24px}
.filete::before,.filete::after{display:none}
.filete svg{display:none}
.filete::after{display:block;content:"";width:56px;height:3px;border-radius:3px;max-width:none;flex:none;background:linear-gradient(90deg,var(--marca),var(--cian))}
.centro .filete{justify-content:center}
/* hero */
.hero{background-color:#0F1733;background-image:radial-gradient(700px 420px at 80% 20%,rgba(47,184,230,.22),transparent 60%),radial-gradient(600px 400px at 10% 90%,rgba(194,163,107,.14),transparent 60%),radial-gradient(rgba(255,255,255,.09) 1px,transparent 1.2px);background-size:auto,auto,22px 22px;background-blend-mode:normal}
.hero::after{display:none}
.hero .ref{font-family:var(--sans);font-style:normal;font-size:.95rem;color:#9FDDF2;font-weight:500}
.hero h1{font-weight:500;letter-spacing:-.03em;font-size:clamp(2.4rem,5vw,4.1rem)}
.btn.oro{background:#fff;border-color:#fff;color:#0F1733}
.btn.linea{border-color:rgba(255,255,255,.35)}
.hero-foto{position:relative;width:100%;max-width:470px;justify-self:end}
.hero-foto .ph{aspect-ratio:4/5;border-radius:22px;background:#1C2650 center/cover no-repeat;box-shadow:0 40px 80px -30px rgba(0,0,0,.6)}
.tarjeta{position:absolute;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);color:#152033;border-radius:14px;padding:12px 16px;box-shadow:0 18px 36px -18px rgba(0,0,0,.5);min-width:210px}
.tarjeta small{display:block;font-size:.76rem;color:#5E6577}
.tarjeta b{font-weight:600;font-size:.98rem}
.tarjeta.t1{left:-36px;top:34px}.tarjeta.t2{right:-20px;bottom:40px}
.estado-h{display:inline-flex;align-items:center;gap:8px}
.estado-h i{width:9px;height:9px;border-radius:50%;background:#9AA0AE}
.estado-h.si i{background:#23A15B;box-shadow:0 0 0 4px rgba(35,161,91,.18)}
@media (max-width:880px){.hero-foto{justify-self:center;order:0}.tarjeta.t1{left:10px}.tarjeta.t2{right:10px}}
/* franja de atención */
.atencion small{font-family:var(--sans);font-style:normal;font-size:.8rem;color:var(--gris);font-weight:500}
/* valores con íconos modernos */
.valor .ico,.especiales li .ico{display:grid;place-items:center;width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,rgba(35,49,96,.08),rgba(47,184,230,.14));color:var(--marca);margin:0 auto 16px}
.valor .ico svg,.especiales li .ico svg{width:30px;height:30px}
.valor h3{font-size:1.35rem}
/* trámites */
.tramites{border:none;gap:18px}
.tram{border:1px solid #E6E9F0;border-radius:var(--r);overflow:hidden;transition:transform .2s,box-shadow .2s}
.tram:hover{background:#fff;transform:translateY(-3px);box-shadow:0 18px 36px -24px rgba(15,23,51,.45)}
.tram:hover h3{text-decoration:none}
.tram .grabado{filter:none;background-color:#E7EBF2}
.tram:hover .grabado{filter:none}
.tram svg{color:var(--marca)}
.tram h3{font-size:1.3rem}
.tram span{color:var(--cian);font-weight:600}
/* proceso */
.paso{border-top:none;padding-top:0}
.paso .num{font-family:var(--sans);font-weight:600;font-size:.95rem;color:#fff;background:linear-gradient(135deg,var(--marca),var(--cian));width:44px;height:44px;border-radius:12px;display:grid;place-items:center;margin-bottom:10px}
.paso h3{font-size:1.2rem}
.foto-proc{position:relative;width:100%;max-width:420px;justify-self:center}
.foto-proc div{aspect-ratio:4/5;border-radius:20px;background:#E7EBF2 center/cover no-repeat}
.flot{position:absolute;left:-24px;bottom:28px;background:#fff;border-radius:12px;padding:12px 16px;box-shadow:0 18px 36px -18px rgba(15,23,51,.45);font-weight:500;display:inline-flex;align-items:center;gap:10px}
.flot b{width:22px;height:22px;border-radius:50%;background:#23A15B;position:relative}
.flot b::after{content:"";position:absolute;left:7px;top:4px;width:6px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
/* servicios en línea */
.linea-sec{background-color:#0F1733;background-image:radial-gradient(600px 300px at 90% 0%,rgba(47,184,230,.18),transparent 60%),radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.2px);background-size:auto,22px 22px}
.servicios{gap:14px;background:transparent;border:none}
.servicios a{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:var(--r);backdrop-filter:blur(8px)}
.servicios a::after{display:none}
.servicios a:hover{background:rgba(255,255,255,.09);border-color:rgba(47,184,230,.6)}
.servicios svg{color:#7FD6F3}
.servicios h3{font-size:1.2rem}
/* notaría */
.marco{border-radius:20px;padding:0;border:none;background:none}
.marco::before{display:none}
.marco div{border-radius:20px;filter:none;background-image:url("https://images.unsplash.com/photo-1627518788331-b3b7fdaa382f?auto=format&fit=crop&w=1200&q=70");background-color:#E7EBF2;border:none}
.marco-pie{font-family:var(--sans);font-style:normal;font-size:.85rem}
.notaria blockquote{font-family:var(--sans);font-style:normal;font-weight:400;letter-spacing:-.01em;font-size:clamp(1.4rem,2.3vw,1.9rem)}
.firma{font-family:var(--sans);font-weight:600;font-size:1.1rem}
/* especiales */
.especiales li{grid-template-columns:56px 1fr;align-items:center}
.especiales li .ico{width:52px;height:52px;border-radius:14px;margin:0}
.especiales li .ico svg{width:24px;height:24px}
.especiales li h3{font-size:1.15rem}
.cita-box{border:none;border-radius:18px;background:#0F1733;color:#fff;background-image:radial-gradient(400px 200px at 100% 0%,rgba(47,184,230,.25),transparent 60%)}
.cita-box::before{display:none}
.cita-box h3{color:#fff}
.cita-box p{color:rgba(255,255,255,.8)!important}
.cita-box a:not(.btn){color:#9FDDF2}
.cita-box .btn{background:#fff;color:#0F1733;border-color:#fff}
/* reseñas */
.nota{font-family:var(--sans);font-weight:500;font-size:4.2rem;letter-spacing:-.03em}
.citas figure{border-top:none;background:#fff;border:1px solid #E6E9F0;border-radius:var(--r);padding:22px}
.citas blockquote{font-family:var(--sans);font-size:1rem;line-height:1.55}
/* noticias sin máscaras */
.noticias article{background:#fff;border:1px solid #E6E9F0;border-radius:var(--r);overflow:hidden}
.noticias .img{outline:none;aspect-ratio:16/10;border-radius:0}
.noticias .img.foto{filter:none}
.noticias .txt{text-align:left;padding:20px 22px 24px}
.noticias time,.tres time{font-family:var(--sans);font-style:normal;font-size:.8rem;color:var(--gris)}
.noticias h3{font-size:1.2rem}
/* institucional */
.tres h3{font-size:1.25rem}
summary::after{font-family:var(--sans);color:var(--cian)}
/* visítenos */
.visita{border-radius:18px;overflow:hidden;border-color:#E6E9F0}
.pin{border-radius:10px}
.entidades span{font-family:var(--sans);font-size:.95rem}
/* pie */
footer{background-color:#0F1733;background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1.2px);background-size:22px 22px}
footer h3{font-family:var(--sans);font-size:1rem;color:#fff;font-weight:600}
footer .legal{border-color:rgba(255,255,255,.12)}
.wa{border:none}
.ruta{list-style:none;margin:34px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px 0;max-width:560px}
.ruta li{flex:1;min-width:150px;display:flex;align-items:center;gap:10px;font-size:.92rem;color:rgba(255,255,255,.88);position:relative;padding-right:18px}
.ruta li:not(:last-child)::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(47,184,230,.7),rgba(255,255,255,.1));margin-left:6px}
.ruta b{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-weight:600;font-size:.85rem;color:#0F1733;background:linear-gradient(135deg,#9FDDF2,#2FB8E6)}
