/* =====================================================================
   ARKLOS · BLOQUES DE CONTENIDO (Fase M)
   Plantillas servicio / general / persona / oficina / legal.
   Línea: mucho aire, filetes finos, serif para títulos, oro solo como acento.
   Usa exclusivamente los tokens --ark-* de design-system.css.
   ===================================================================== */

.ab-body { background: var(--ark-white); }
.ab { padding: clamp(3.2rem, 6vw, 5.6rem) 0; border-top: 1px solid var(--ark-line); }
.ab-body > .ab:first-child { border-top: 0; }
.ab-body > .svc-body + .ab { border-top: 1px solid var(--ark-line); }

/* --- Cabecera de bloque ------------------------------------------------ */
.ab-head { max-width: 760px; margin: 0 0 clamp(1.8rem, 4vw, 2.8rem); }
.ab-head--center { margin-inline: auto; text-align: center; }
.ab-eyebrow {
    font: 800 var(--step--1)/1.2 var(--ark-sans);
    letter-spacing: .16em; text-transform: uppercase;
    color: var(--ark-gold-deep); margin: 0 0 .9rem;
}
.ab-h2 { font-size: clamp(2rem, 1.4rem + 2.2vw, 3rem); line-height: 1.04; margin: 0 0 .5em; text-wrap: balance; }
.ab-intro p { color: var(--ark-graphite); font-size: var(--step-1); line-height: 1.55; max-width: 62ch; }
.ab-head--center .ab-intro p { margin-inline: auto; }
.ab-note { margin-top: 1.6rem; color: var(--ark-mute); font-size: var(--step--1); }
.ab-note--center { text-align: center; }

/* --- Prosa ------------------------------------------------------------- */
.ab-prose { font-size: var(--step-0); color: var(--ark-ink); max-width: 72ch; }
.ab-prose--narrow { max-width: 68ch; }
.ab-prose h2 { font-size: var(--step-2); margin: 2rem 0 .7rem; line-height: 1.1; }
.ab-prose h3 { font-size: var(--step-1); font-family: var(--ark-sans); font-weight: 800; letter-spacing: 0; margin: 1.6rem 0 .5rem; line-height: 1.25; }
.ab-prose p, .ab-prose li { color: var(--ark-graphite); line-height: 1.75; }
.ab-prose ul, .ab-prose ol { padding-left: 1.2rem; margin: 0 0 1.2rem; }
.ab-prose a { color: var(--ark-black); text-decoration: underline; text-decoration-color: var(--ark-gold); text-decoration-thickness: 2px; }
.ab-prose strong { color: var(--ark-black); }

/* --- Texto con destacado lateral -------------------------------------- */
.ab-texto__grid.has-aside { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.ab-texto__aside { border-left: 3px solid var(--ark-gold); padding: .2rem 0 .2rem 1.6rem; position: sticky; top: 120px; }
.ab-texto__aside p { font: 400 clamp(1.5rem, 1.1rem + 1.2vw, 2.1rem)/1.2 var(--ark-display); color: var(--ark-black); letter-spacing: -.02em; margin: 0; }

/* --- Tarjetas (Qué incluye) -------------------------------------------- */
.ab-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--ark-line); border-left: 1px solid var(--ark-line); }
.ab-cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ab-cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ab-card { padding: clamp(1.4rem, 3vw, 2rem); border-right: 1px solid var(--ark-line); border-bottom: 1px solid var(--ark-line); transition: background .2s ease; }
.ab-card:hover { background: var(--ark-paper); }
.ab-card h3 { font: 800 1.08rem/1.3 var(--ark-sans); letter-spacing: 0; margin: 0 0 .55rem; color: var(--ark-black); }
.ab-card h3::before { content: ""; display: block; width: 1.6rem; height: 2px; background: var(--ark-gold); margin-bottom: 1rem; }
.ab-card p { color: var(--ark-graphite); font-size: .98rem; line-height: 1.6; margin: 0 0 .6rem; }

/* --- Marco normativo --------------------------------------------------- */
.ab-normativa { background: var(--ark-paper); }
.ab-laws { list-style: none; margin: 0; padding: 0; display: grid; }
.ab-law { display: grid; grid-template-columns: minmax(150px, .32fr) 1fr; gap: clamp(1rem, 4vw, 3rem); padding: 1.5rem 0; border-top: 1px solid var(--ark-line); }
.ab-law:last-child { border-bottom: 1px solid var(--ark-line); }
.ab-law__ref { font: 400 1.35rem/1.15 var(--ark-display); color: var(--ark-black); }
.ab-law__ref a { text-decoration: none; }
.ab-law__ref a:hover { color: var(--ark-gold-deep); }
.ab-law__ref span { font-size: .8em; color: var(--ark-gold-deep); }
.ab-law__body h3 { font: 800 1.05rem/1.3 var(--ark-sans); letter-spacing: 0; margin: .15rem 0 .45rem; }
.ab-law__body p { color: var(--ark-graphite); margin: 0 0 .5rem; }

/* --- Pasos ------------------------------------------------------------- */
.ab-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--ab-steps, 4), minmax(0, 1fr)); gap: clamp(1.2rem, 3vw, 2.4rem); counter-reset: none; }
.ab-step { border-top: 2px solid var(--ark-black); padding-top: 1.2rem; }
.ab-step__n { display: block; font: 400 2.6rem/1 var(--ark-display); color: var(--ark-gold-deep); margin-bottom: .9rem; font-style: italic; }
.ab-step h3 { font: 800 1.05rem/1.3 var(--ark-sans); letter-spacing: 0; margin: 0 0 .45rem; }
.ab-step p { color: var(--ark-graphite); font-size: .97rem; margin: 0; }

/* --- Precios ----------------------------------------------------------- */
.ab-prices { display: grid; gap: 1.2rem; grid-template-columns: repeat(var(--ab-prices, 3), minmax(0, 1fr)); }
.ab-prices--1 { --ab-prices: 1; max-width: 460px; }
.ab-prices--2 { --ab-prices: 2; max-width: 880px; }
.ab-prices--3 { --ab-prices: 3; }
.ab-price { position: relative; display: flex; flex-direction: column; border: 1px solid var(--ark-line); border-radius: var(--ark-radius-sm); padding: clamp(1.5rem, 3vw, 2rem); background: #fff; }
.ab-price.is-featured { border-color: var(--ark-black); box-shadow: 0 24px 60px -40px rgba(8,8,10,.55); }
.ab-price__flag { position: absolute; top: -.75rem; left: 1.5rem; background: var(--ark-gold); color: var(--ark-black); font: 800 .72rem/1 var(--ark-sans); letter-spacing: .12em; text-transform: uppercase; padding: .45rem .7rem; border-radius: 999px; }
.ab-price h3 { font: 800 1.1rem/1.3 var(--ark-sans); letter-spacing: 0; margin: 0 0 .9rem; }
.ab-price__amount { margin: 0 0 .8rem; color: var(--ark-mute); }
.ab-price__amount strong { font: 400 2.8rem/1 var(--ark-display); color: var(--ark-black); letter-spacing: -.03em; }
.ab-price__desc { color: var(--ark-graphite); font-size: .95rem; }
.ab-price__cta { margin-top: auto; width: 100%; }
.ab-checks { list-style: none; padding: 0; margin: .4rem 0 1.4rem; display: grid; gap: .55rem; }
.ab-checks li { position: relative; padding-left: 1.6rem; color: var(--ark-ink); font-size: .95rem; line-height: 1.45; }
.ab-checks li::before { content: ""; position: absolute; left: 0; top: .42em; width: .9rem; height: .5rem; border-left: 2px solid var(--ark-gold-deep); border-bottom: 2px solid var(--ark-gold-deep); transform: rotate(-45deg); }

/* --- Persona (bloque y ficha) ----------------------------------------- */
.ab-person { display: grid; grid-template-columns: minmax(160px, 240px) 1fr; gap: clamp(1.6rem, 5vw, 4rem); align-items: start; }
.ab-person__photo img, .ab-profile__photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--ark-radius-sm); filter: grayscale(.15); }
.ab-person__initials { display: grid; place-items: center; width: 100%; aspect-ratio: 4 / 5; border-radius: var(--ark-radius-sm); background: var(--ark-black); color: var(--ark-gold); font: 400 5rem/1 var(--ark-display); }
.ab-person__name { margin-bottom: .2rem; }
.ab-person__role, .ab-profile__role { font-weight: 800; color: var(--ark-graphite); margin: 0 0 1rem; }
.ab-person__body p { color: var(--ark-graphite); max-width: 64ch; }
.ab-person__creds { list-style: none; padding: 0; margin: 1.2rem 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.ab-person__creds li { border: 1px solid var(--ark-line); border-radius: 999px; padding: .4rem .85rem; font-size: .86rem; font-weight: 700; color: var(--ark-ink); background: #fff; }
.ab-person__creds--lg li { font-size: .92rem; }
.ab-person__links { display: flex; flex-wrap: wrap; gap: .6rem 1.4rem; align-items: center; margin: 1.2rem 0 0; }
.ab-person__links > a:not(.btn) { font-weight: 800; text-decoration: none; border-bottom: 2px solid var(--ark-gold); }

/* --- FAQ --------------------------------------------------------------- */
.ab-faq__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.ab-faq__grid .ab-head { position: sticky; top: 120px; }
.ab-faq__list { border-top: 1px solid var(--ark-line); }
.ab-faq .ab-faq__item { border: 0; border-bottom: 1px solid var(--ark-line); border-radius: 0; padding: 0; background: transparent; box-shadow: none; }
.ab-faq .ab-faq__item summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1.2rem; padding: 1.25rem 0; font-weight: 800; font-size: 1.04rem; line-height: 1.4; color: var(--ark-black); }
.ab-faq__item summary::-webkit-details-marker { display: none; }
.ab-faq__item summary::after { content: "+"; font: 400 1.6rem/1 var(--ark-sans); color: var(--ark-gold-deep); transition: transform .2s ease; }
.ab-faq__item[open] summary::after { transform: rotate(45deg); }
.ab-faq__a { padding: 0 0 1.3rem; }
.ab-faq .ab-faq__a p { color: var(--ark-graphite); margin: 0 0 .6rem; }

/* --- Relacionados ------------------------------------------------------ */
.ab-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; }
.ab-link { position: relative; display: flex; flex-direction: column; gap: .45rem; padding: 1.4rem 1.4rem 2.8rem; border: 1px solid var(--ark-line); border-radius: var(--ark-radius-sm); text-decoration: none; color: var(--ark-black); transition: border-color .2s ease, transform .2s ease; }
.ab-link:hover { border-color: var(--ark-black); transform: translateY(-2px); color: var(--ark-black); }
.ab-link__kicker { font: 800 .72rem/1 var(--ark-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ark-gold-deep); }
.ab-link strong { font: 400 1.35rem/1.15 var(--ark-display); letter-spacing: -.01em; }
.ab-link__text { color: var(--ark-graphite); font-size: .94rem; line-height: 1.5; }
.ab-link__arrow { position: absolute; left: 1.4rem; bottom: 1.1rem; font-weight: 800; }

/* --- Cifras ------------------------------------------------------------ */
.ab-cifras { background: var(--ark-paper); }
.ab-figures { margin: 0; display: grid; grid-template-columns: repeat(var(--ab-figs, 4), minmax(0, 1fr)); }
.ab-figure { display: flex; flex-direction: column-reverse; align-items: center; text-align: center; padding: .4rem 1rem; border-left: 1px solid var(--ark-line); }
.ab-figure:first-child { border-left: 0; }
.ab-figure dd { margin: 0; font: italic 400 clamp(2.8rem, 2rem + 3vw, 4.6rem)/1 var(--ark-display); color: var(--ark-black); letter-spacing: -.03em; }
.ab-figure dt { margin-top: .6rem; color: var(--ark-graphite); font-weight: 700; font-size: .95rem; }

/* --- Acreditaciones ---------------------------------------------------- */
.ab-creds { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0; border-top: 1px solid var(--ark-line); }
.ab-cred { display: grid; grid-template-columns: auto 1fr; gap: 1rem; padding: 1.5rem 1.2rem 1.5rem 0; border-bottom: 1px solid var(--ark-line); }
.ab-cred__logo { width: 56px; height: 56px; object-fit: contain; }
.ab-cred__issuer { font: 800 .72rem/1 var(--ark-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ark-mute); }
.ab-cred h3 { font: 400 1.4rem/1.15 var(--ark-display); margin: .4rem 0 .45rem; }
.ab-cred p { color: var(--ark-graphite); font-size: .95rem; margin: 0 0 .5rem; }
.ab-cred__verify { font-weight: 800; font-size: .9rem; text-decoration: none; border-bottom: 2px solid var(--ark-gold); }

/* --- Cita -------------------------------------------------------------- */
.ab-quote { margin: 0 auto; max-width: 900px; text-align: center; }
.ab-quote blockquote { margin: 0; }
.ab-quote blockquote p { font: 400 clamp(1.7rem, 1.2rem + 1.8vw, 2.6rem)/1.2 var(--ark-display); letter-spacing: -.02em; color: var(--ark-black); }
.ab-quote blockquote p::before { content: "“"; color: var(--ark-gold); }
.ab-quote blockquote p::after { content: "”"; color: var(--ark-gold); }
.ab-quote figcaption { display: flex; justify-content: center; flex-wrap: wrap; gap: .3rem .8rem; color: var(--ark-mute); font-size: .95rem; }
.ab-quote figcaption strong { color: var(--ark-black); }

/* --- Oficinas ---------------------------------------------------------- */
.ab-offices { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.2rem; }
.ab-office { border: 1px solid var(--ark-line); border-radius: var(--ark-radius-sm); padding: 1.6rem; }
.ab-office h3 { font-size: 1.6rem; margin: 0 0 .5rem; }
.ab-office__note { display: inline-block; background: var(--ark-gold-wash); color: #5a4400; font-weight: 800; font-size: .82rem; padding: .3rem .7rem; border-radius: 999px; }
.ab-office__addr { color: var(--ark-graphite); }
.ab-office__hours { margin: 0 0 1rem; display: grid; gap: .3rem; font-size: .93rem; }
.ab-office__hours div { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 1px dashed var(--ark-line); padding-bottom: .3rem; }
.ab-office__hours dt { color: var(--ark-mute); }
.ab-office__hours dd { margin: 0; font-weight: 700; }
.ab-office__links { display: flex; flex-wrap: wrap; gap: 1rem; margin: 0; }
.ab-office__links a { font-weight: 800; text-decoration: none; border-bottom: 2px solid var(--ark-gold); }

/* --- CTA --------------------------------------------------------------- */
.ab-cta { border-top: 0; }
.ab-cta__box { display: grid; grid-template-columns: minmax(0, 1.2fr) auto; gap: 2rem; align-items: center; background: var(--ark-black); color: rgba(255,255,255,.8); border-radius: var(--ark-radius); padding: clamp(2rem, 5vw, 3.6rem); }
.ab-cta__box .ab-h2 { color: #fff; margin-bottom: .3em; }
.ab-cta__text p { color: rgba(255,255,255,.72); margin: 0; max-width: 54ch; }
.ab-cta__actions { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: flex-end; }

/* --- Hero claro (general, persona, oficina) --------------------------- */
.ab-hero { background: var(--ark-paper); padding: clamp(2rem, 4vw, 3rem) 0 clamp(3rem, 6vw, 5rem); border-bottom: 1px solid var(--ark-line); }
.ab-hero__title { font-size: clamp(2.6rem, 1.8rem + 3.6vw, 4.8rem); line-height: 1; margin: 1.6rem 0 1rem; max-width: 18ch; text-wrap: balance; }
.ab-hero__lead { font-size: var(--step-1); color: var(--ark-graphite); max-width: 60ch; line-height: 1.55; margin: 0; }
.ab-profile { display: grid; grid-template-columns: minmax(200px, 340px) 1fr; gap: clamp(2rem, 6vw, 5rem); align-items: end; margin-top: 1.6rem; }
.ab-profile .ab-hero__title { margin-top: 0; }
.ab-officehero { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr); gap: clamp(2rem, 6vw, 5rem); align-items: end; }
.ab-nap { margin: 0; background: #fff; border: 1px solid var(--ark-line); border-radius: var(--ark-radius-sm); padding: 1.2rem 1.4rem; display: grid; gap: .6rem; }
.ab-nap div { display: grid; grid-template-columns: 7.5rem 1fr; gap: .8rem; font-size: .95rem; }
.ab-nap dt { color: var(--ark-mute); }
.ab-nap dd { margin: 0; font-weight: 700; color: var(--ark-black); }
.ab-nap a { text-decoration: none; }

/* Hero de servicio: ajustes sobre el .svc-hero existente */
.ab-svc-hero .svc-hero__grid { margin-top: 1.4rem; }
.ab-svc-hero__creds { color: rgba(255,255,255,.62); font-size: .88rem; letter-spacing: .02em; margin: 0; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,.14); max-width: 46ch; }

/* --- Migas ------------------------------------------------------------- */
.ab-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .2rem .5rem; font-size: .85rem; color: var(--ark-mute); }
.ab-crumbs li + li::before { content: "/"; margin-right: .5rem; color: var(--ark-line); }
.ab-crumbs a { color: var(--ark-graphite); text-decoration: none; }
.ab-crumbs a:hover { color: var(--ark-black); text-decoration: underline; text-decoration-color: var(--ark-gold); }
.ab-crumbs [aria-current] { color: var(--ark-black); font-weight: 700; }
.ab-crumbs--dark ol { color: rgba(255,255,255,.55); }
.ab-crumbs--dark li + li::before { color: rgba(255,255,255,.25); }
.ab-crumbs--dark a { color: rgba(255,255,255,.7); }
.ab-crumbs--dark a:hover { color: #fff; }
.ab-crumbs--dark [aria-current] { color: #fff; }
.legal-hero .ab-crumbs { margin-bottom: .4rem; }

/* --- Barra de vista previa -------------------------------------------- */
.ab-preview { position: sticky; top: 0; z-index: 60; background: var(--ark-gold); color: var(--ark-black); text-align: center; font-size: .92rem; padding: .6rem 1rem; }
.ab-preview a { font-weight: 800; margin-left: .6rem; }

/* --- Responsive -------------------------------------------------------- */
@media (max-width: 980px) {
    .ab-cards--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ab-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ab-prices--3 { grid-template-columns: 1fr; max-width: 520px; }
    .ab-faq__grid, .ab-texto__grid.has-aside { grid-template-columns: 1fr; }
    .ab-faq__grid .ab-head, .ab-texto__aside { position: static; }
    .ab-cta__box { grid-template-columns: 1fr; }
    .ab-cta__actions { justify-content: flex-start; }
    .ab-officehero { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
    .ab-cards--3, .ab-cards--2, .ab-steps, .ab-prices--2 { grid-template-columns: 1fr; }
    .ab-law { grid-template-columns: 1fr; gap: .4rem; }
    .ab-person, .ab-profile { grid-template-columns: 1fr; }
    .ab-person__photo, .ab-profile__photo { max-width: 220px; }
    .ab-figures { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.6rem; }
    .ab-figure:nth-child(odd) { border-left: 0; }
    .ab-nap div { grid-template-columns: 1fr; gap: .1rem; }
}

/* --- Ficha de autor en artículos y guías (Fase A) ---------------------- */
.ab-author { display: grid; grid-template-columns: 96px 1fr; gap: 1.4rem; align-items: start; margin: 2.8rem 0 1rem; padding: 1.6rem 0; border-top: 2px solid var(--ark-black); border-bottom: 1px solid var(--ark-line); }
.ab-author__photo img, .ab-author__photo .ab-person__initials { width: 96px; aspect-ratio: 4 / 5; border-radius: 12px; object-fit: cover; font-size: 2.6rem; }
.ab-author .ab-eyebrow { margin-bottom: .4rem; }
.ab-author__name { font: 400 1.6rem/1.1 var(--ark-display); margin: 0 0 .2rem; }
.ab-author__name a { text-decoration: none; border-bottom: 2px solid var(--ark-gold); }
.ab-author__role { font-weight: 700; color: var(--ark-graphite); margin: 0 0 .6rem; font-size: .95rem; }
.ab-author .ab-person__creds { margin: .6rem 0; }
.ab-author__dates { color: var(--ark-mute); font-size: .88rem; margin: .4rem 0 0; }
@media (max-width: 560px) { .ab-author { grid-template-columns: 64px 1fr; } .ab-author__photo img, .ab-author__photo .ab-person__initials { width: 64px; font-size: 1.8rem; } }
