/* ═══════════════════════════════════════════════════
   Pietropinto Design System — CSS
   ═══════════════════════════════════════════════════ */

:root {
  --navy: #1B2845;
  --paper: #F4F1EA;
  --cream: #EBE5D7;
  --terra: #C8836A;
  --ink: #0E0E10;
  --sand: #D8CDB8;
  --faint: rgba(27,40,69,0.12);
  --footer-bg: #141e35;
  --max-w: 1280px;
  --max-w-text: 720px;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--paper); color: var(--navy); }
::selection { background: var(--navy); color: var(--paper); }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }

/* ── Typography ── */
body { font: 400 16px/1.6 'Manrope', system-ui, sans-serif; }
h1, h2, h3 { font-family: 'Instrument Serif', Georgia, serif; font-weight: 400; line-height: 1.15; margin: 0; }
h1 { font-size: clamp(36px, 5vw, 64px); letter-spacing: -0.02em; }
h2 { font-size: clamp(28px, 4vw, 48px); letter-spacing: -0.02em; }
h3 { font-size: clamp(22px, 3vw, 32px); }
p { margin: 0 0 1em; }

.eyebrow {
  font: 500 10px 'JetBrains Mono', monospace;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  opacity: 0.55;
  margin-bottom: 12px;
}
.eyebrow--terra { color: var(--terra); opacity: 1; }

.lede {
  font-size: clamp(16px, 2vw, 19px);
  opacity: 0.78;
  line-height: 1.6;
  max-width: 55ch;
}

.mono {
  font-family: 'JetBrains Mono', monospace;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

/* ── Layout ── */
.container { max-width: var(--max-w); margin: 0 auto; padding: 0 20px; }
@media (min-width: 769px) { .container { padding: 0 40px; } }

/* Section paddings match site-v2 React SPA (py prop on Section component) */
.section { padding: 64px 0; }
.section--lg { padding: 96px 0; }
.section--sm { padding: 48px 0; }
@media (max-width: 768px) {
  .section { padding: 38px 0; }
  .section--lg { padding: 58px 0; }
  .section--sm { padding: 32px 0; }
}
.section--navy { background: var(--navy); color: var(--paper); }
.section--cream { background: var(--cream); }
.section--paper { background: var(--paper); }

.grid-2 { display: grid; grid-template-columns: 1fr; gap: 32px; }
.grid-3 { display: grid; grid-template-columns: 1fr; gap: 28px; }
.grid-5 { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 769px) {
  .grid-2 { grid-template-columns: 1fr 1fr; gap: 64px; }
  .grid-3 { grid-template-columns: repeat(3, 1fr); gap: 48px; }
  .grid-5 { grid-template-columns: repeat(5, 1fr); gap: 32px; }
}

.text-center { text-align: center; }
.mx-auto { margin-left: auto; margin-right: auto; }
.max-w-text { max-width: var(--max-w-text); }
.max-w-narrow { max-width: 560px; }

/* Alias: original site-v2 React SPA used 1280px containers everywhere */
.container--wide { max-width: var(--max-w); margin: 0 auto; padding: 0 20px; }
@media (min-width: 769px) { .container--wide { padding: 0 40px; } }

/* ── Grid background overlay (matches GridBg from React SPA) ── */
.grid-bg {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(var(--navy) 1px, transparent 1px),
    linear-gradient(90deg, var(--navy) 1px, transparent 1px);
  background-size: 40px 40px;
  opacity: 0.06; mix-blend-mode: multiply;
}

/* ── Navigation ── */
.nav {
  position: sticky; top: 0; z-index: 100;
  background: var(--paper); border-bottom: 1px solid var(--faint);
}
.nav__inner {
  max-width: 1280px; margin: 0 auto;
  padding: 0 20px; height: 60px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
@media (min-width: 769px) {
  .nav__inner { padding: 0 40px; height: 72px; }
}

.nav__logo {
  font: 700 22px 'Manrope', sans-serif;
  letter-spacing: 0.005em; line-height: 1;
  color: var(--navy); text-decoration: none; white-space: nowrap;
}

.nav__links {
  display: none; gap: 28px; align-items: center;
  list-style: none; margin: 0; padding: 0;
}
@media (min-width: 769px) { .nav__links { display: flex; } }

.nav__link {
  position: relative; display: inline-block;
  font: 500 14px 'Manrope', sans-serif;
  color: var(--navy); text-decoration: none;
  letter-spacing: 0.02em;
  padding: 8px 2px;
  opacity: 0.65;
  transition: opacity .15s;
}
.nav__link:hover { opacity: 1; }
.nav__link.is-active { opacity: 1; font-weight: 800; }
.nav__link.is-active::after {
  content: ''; position: absolute;
  left: 0; right: 0; bottom: -4px;
  height: 2px; background: var(--navy);
}

.nav__mobile-toggle {
  display: flex; flex-direction: column; gap: 5px;
  align-items: center; justify-content: center;
  background: none; border: none; cursor: pointer; padding: 8px;
}
.nav__mobile-toggle span {
  display: block; width: 22px; height: 2px;
  background: var(--navy); border-radius: 1px;
  transition: transform .2s, opacity .15s;
}
@media (min-width: 769px) { .nav__mobile-toggle { display: none; } }

.nav__mobile-menu {
  display: none; position: fixed; inset: 0; top: 60px;
  background: var(--paper); z-index: 99; padding: 32px 24px;
  flex-direction: column; gap: 8px; overflow-y: auto;
}
.nav__mobile-menu.open { display: flex; }
.nav__mobile-menu a {
  font: 500 18px 'Manrope', sans-serif;
  color: var(--navy); text-decoration: none;
  padding: 14px 0; border-bottom: 1px solid var(--faint);
  opacity: 0.65;
}
.nav__mobile-menu a.is-active { opacity: 1; }

/* ── Buttons ── */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  font: 600 14px 'Manrope', sans-serif;
  padding: 14px 22px; border-radius: 999px;
  text-decoration: none; border: none; cursor: pointer;
  transition: background .15s, color .15s;
  letter-spacing: 0.01em;
}
.btn--primary { background: var(--navy); color: var(--paper); }
.btn--primary:hover { background: var(--terra); }
.btn--dark { background: var(--paper); color: var(--navy); }
.btn--dark:hover { background: var(--terra); color: var(--paper); }
.btn--outline { background: transparent; color: var(--navy); border: 1.5px solid var(--navy); }
.btn--outline:hover { background: var(--navy); color: var(--paper); }
.btn--outline-light { background: transparent; color: var(--paper); border: 1.5px solid rgba(244,241,234,0.4); }
.btn--outline-light:hover { background: var(--paper); color: var(--navy); }

.btn-group { display: flex; gap: 14px; flex-wrap: wrap; }

.wa-icon {
  display: inline-block; width: 14px; height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347z'/%3E%3Cpath fill='currentColor' d='M12 0C5.373 0 0 5.373 0 12c0 2.625.846 5.059 2.284 7.034L.789 23.492a.5.5 0 0 0 .612.616l4.584-1.468A11.96 11.96 0 0 0 12 24c6.627 0 12-5.373 12-12S18.627 0 12 0zm0 22c-2.319 0-4.478-.669-6.313-1.823l-.378-.237-3.254 1.042 1.065-3.173-.26-.393A9.96 9.96 0 0 1 2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.btn--dark .wa-icon { filter: none; }

/* ── Cards & Boxes ── */
.callout {
  padding: 20px 24px;
  background: var(--cream);
  border-left: 3px solid var(--terra);
  margin: 24px 0;
}
.callout p { margin: 0; }

.card {
  padding: 28px 32px;
  background: var(--paper);
  border: 1px dashed var(--navy);
}

.sidebar-box {
  padding: 32px;
  background: var(--cream);
  border: 1px solid var(--faint);
}
@media (min-width: 769px) {
  .sidebar-box--sticky { position: sticky; top: 96px; }
}

.stat__value {
  font: 400 56px 'Instrument Serif', Georgia, serif;
  color: var(--navy); letter-spacing: -0.02em; line-height: 1;
  margin-bottom: 8px;
}
.stat__label { font: 500 11px 'JetBrains Mono', monospace; letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.6; }
@media (max-width: 768px) { .stat__value { font-size: 40px; } }

.step-num {
  font: 400 56px 'Instrument Serif', Georgia, serif;
  color: var(--terra); line-height: 1; margin-bottom: 12px; opacity: 0.9;
}
@media (max-width: 768px) { .step-num { font-size: 40px; } }

.check-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.check-list li { display: flex; gap: 10px; font-size: 13.5px; opacity: 0.8; }
.check-list .check { color: var(--terra); font-weight: 700; flex-shrink: 0; }

/* ── Tables ── */
.doc-table { width: 100%; border-collapse: collapse; margin: 24px 0; }
.doc-table th, .doc-table td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--faint); font-size: 14px; }
.doc-table th { font: 500 10px 'JetBrains Mono', monospace; letter-spacing: 0.14em; text-transform: uppercase; opacity: 0.55; }
.doc-table td:first-child { font-weight: 600; white-space: nowrap; color: var(--terra); }

/* ── FAQ Accordion ── */
.faq { border-top: 1px solid var(--faint); }
.faq details { border-bottom: 1px solid var(--faint); }
.faq summary {
  padding: 18px 0; cursor: pointer; list-style: none;
  font: 500 16px 'Manrope', sans-serif; color: var(--navy);
  display: flex; justify-content: space-between; align-items: center;
}
.faq summary::after { content: '+'; font-size: 22px; opacity: 0.4; transition: transform .2s; }
.faq details[open] summary::after { content: '−'; }
.faq details p { padding: 0 0 18px; opacity: 0.75; line-height: 1.65; font-size: 15px; margin: 0; }

/* ── Testimonials ── */
.testimonial {
  padding: 28px 32px; background: var(--paper);
  border: 1px dashed var(--navy); height: 100%;
  display: flex; flex-direction: column; justify-content: space-between;
}
.testimonial__tag { font: 500 9px 'JetBrains Mono', monospace; letter-spacing: 0.16em; text-transform: uppercase; opacity: 0.45; margin-bottom: 8px; }
.testimonial__stars { color: var(--terra); font-size: 14px; letter-spacing: 2px; margin-bottom: 10px; }
.testimonial__quote { font: 400 15px 'Instrument Serif', Georgia, serif; font-style: italic; line-height: 1.5; }
.testimonial__author { font: 500 11px 'JetBrains Mono', monospace; letter-spacing: 0.14em; text-transform: uppercase; color: var(--terra); margin-top: 14px; }
.testimonial--compact { padding: 20px 24px; }
.testimonial--compact .testimonial__quote { font-size: 14px; }
.testimonial--compact .testimonial__stars { font-size: 12px; margin-bottom: 8px; }

/* ── Footer ── */
.footer { background: var(--footer-bg); color: var(--paper); padding: 72px 40px 32px; }
@media (max-width: 768px) { .footer { padding: 48px 20px 24px; } }

.footer__grid {
  display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 48px; max-width: var(--max-w); margin: 0 auto;
  padding-bottom: 48px; border-bottom: 1px solid rgba(244,241,234,0.15);
}
@media (max-width: 768px) { .footer__grid { grid-template-columns: 1fr; gap: 32px; } }

.footer__logo {
  font: 700 28px 'Manrope', sans-serif;
  letter-spacing: 0.005em; line-height: 1;
  color: var(--paper);
}
@media (max-width: 768px) { .footer__logo { font-size: 22px; } }
.footer__desc { font-size: 14px; opacity: 0.75; line-height: 1.6; margin-top: 20px; max-width: 320px; }
.footer__col-title { font: 500 10px 'JetBrains Mono', monospace; letter-spacing: 0.16em; text-transform: uppercase; opacity: 0.5; margin-bottom: 18px; }
.footer__col-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.footer__col-list a { font-size: 13.5px; color: var(--paper); opacity: 0.8; text-decoration: none; transition: opacity .15s; }
.footer__col-list a:hover { opacity: 1; }

.footer__bottom {
  padding-top: 20px; max-width: var(--max-w); margin: 0 auto;
  display: flex; justify-content: space-between;
  font: 500 11px 'JetBrains Mono', monospace; letter-spacing: 0.08em;
  text-transform: uppercase; opacity: 0.5;
}
@media (max-width: 768px) { .footer__bottom { flex-direction: column; gap: 6px; font-size: 9px; } }

/* ── Hero (matches site-v2 React SPA hero exactly) ── */
.hero { position: relative; overflow: hidden; }
.hero__inner { padding: 64px 40px 80px; position: relative; }
@media (max-width: 768px) { .hero__inner { padding: 32px 20px 48px; } }

.hero__grid {
  display: grid; grid-template-columns: 1fr; gap: 36px; align-items: center;
}
@media (min-width: 769px) {
  .hero__grid { grid-template-columns: 1fr 1.15fr; gap: 64px; }
}

.hero__copy { min-width: 0; }

.hero__h1 {
  font: 400 88px 'Instrument Serif', Georgia, serif;
  color: var(--navy);
  line-height: 0.96; letter-spacing: -0.025em;
  margin: 8px 0 20px; max-width: 11ch;
  text-wrap: balance;
}
.hero__h1 em { color: var(--terra); font-style: italic; }
@media (max-width: 768px) {
  .hero__h1 { font-size: 48px; line-height: 1.02; }
}

.hero__lede {
  font: 400 19px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.82;
  line-height: 1.55; max-width: 40ch; margin-bottom: 32px;
}
@media (max-width: 768px) {
  .hero__lede { font-size: 16px; margin-bottom: 24px; }
}

.hero__actions {
  display: flex; gap: 14px; flex-wrap: wrap; align-items: center;
}
.hero__textlink {
  font: 500 14px 'Manrope', sans-serif;
  color: var(--navy); text-decoration: none;
  border-bottom: 1px solid var(--navy); padding-bottom: 4px;
}

.hero__stats {
  display: flex; gap: 32px;
  margin-top: 56px; padding-top: 28px;
  border-top: 1px solid var(--faint);
}
@media (max-width: 768px) {
  .hero__stats { gap: 20px; margin-top: 36px; padding-top: 20px; flex-wrap: wrap; }
}

.hero__drawing {
  display: none; position: relative; padding-left: 32px;
}
@media (min-width: 769px) { .hero__drawing { display: block; } }
.hero__drawing-caption {
  position: absolute; bottom: -16px; right: 0;
  font: italic 400 12px 'Instrument Serif', Georgia, serif;
  color: var(--navy); opacity: 0.6;
}

/* ── Headlines used inside home sections ── */
.h2-lg {
  font: 400 48px 'Instrument Serif', Georgia, serif;
  color: var(--navy); letter-spacing: -0.015em; line-height: 1.12;
  margin: 0; text-wrap: balance;
}
@media (max-width: 768px) { .h2-lg { font-size: 30px; } }

.h2-xl {
  font: 400 56px 'Instrument Serif', Georgia, serif;
  color: var(--navy); letter-spacing: -0.015em; line-height: 1.12;
  margin: 0; text-wrap: balance;
}
@media (max-width: 768px) { .h2-xl { font-size: 36px; } }

.opacity-78 { opacity: 0.78; }

/* ── Home: Calculator section ── */
.home-calc-grid {
  display: grid; grid-template-columns: 1fr; gap: 32px; align-items: start;
}
@media (min-width: 769px) {
  .home-calc-grid { grid-template-columns: 1fr 1.6fr; gap: 64px; }
}
.home-calc-lede {
  font: 400 16px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.78;
  line-height: 1.6; margin-top: 16px; max-width: 38ch;
}
@media (max-width: 768px) { .home-calc-lede { font-size: 14px; } }

/* ── Home: Services section ── */
.home-services-head {
  display: grid; grid-template-columns: 1fr; gap: 12px;
  margin-bottom: 28px; align-items: end;
}
@media (min-width: 769px) {
  .home-services-head {
    grid-template-columns: 1.4fr 1fr; gap: 64px; margin-bottom: 48px;
  }
}
.home-services-head p {
  font: 400 17px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.78;
  line-height: 1.55; margin: 0;
}
@media (max-width: 768px) { .home-services-head p { font-size: 15px; margin-top: 12px; } }

.home-services-grid {
  display: grid; grid-template-columns: 1fr; gap: 36px;
}
@media (min-width: 769px) {
  .home-services-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}

.service-card { display: flex; flex-direction: column; gap: 18px; }
.service-card__photo {
  position: relative; aspect-ratio: 4/3;
  overflow: hidden; background: var(--cream);
  border: 1px solid var(--faint);
}
.service-card__photo img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.service-card__label {
  position: absolute; bottom: 12px; left: 16px;
  font: 500 9px 'JetBrains Mono', monospace;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--paper); text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  opacity: 0.85;
}
.service-card__title {
  font: 400 28px 'Instrument Serif', Georgia, serif;
  color: var(--navy); line-height: 1.15; letter-spacing: -0.01em;
  margin: 0;
}
.service-card__title a { color: inherit; text-decoration: none; }
.service-card__title a:hover { color: var(--terra); }
.service-card__body {
  font: 400 14.5px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.78; line-height: 1.6;
  margin: 0; max-width: 50ch;
}

/* ── Home: Testimonials ── */
.home-testimonials {
  display: grid; grid-template-columns: 1fr; gap: 16px; margin-top: 20px;
}
@media (min-width: 769px) {
  .home-testimonials {
    grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 32px;
  }
}

/* ── Home: Client Feature ── */
.client-feature {
  display: grid; grid-template-columns: 1fr; gap: 36px; align-items: center;
}
@media (min-width: 769px) {
  .client-feature { grid-template-columns: 1.3fr 1fr; gap: 80px; }
}
.client-feature__photo { position: relative; }
.client-feature__img {
  position: relative; aspect-ratio: 4/5;
  background: var(--cream); border: 1px solid var(--faint);
  overflow: hidden;
}
.client-feature__img img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.client-feature__caption {
  position: absolute; bottom: 18px; left: 18px;
  font: 500 10px 'JetBrains Mono', monospace;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--paper); text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  opacity: 0.85;
}
.client-feature__badge {
  position: absolute; bottom: -28px; left: -28px;
  background: var(--paper); border: 1.5px solid var(--navy);
  padding: 18px 22px; max-width: 240px;
}
.client-feature__quote {
  font: 400 28px 'Instrument Serif', Georgia, serif;
  color: var(--navy); line-height: 1.3; letter-spacing: -0.01em;
  margin: 14px 0 24px;
}
@media (max-width: 768px) { .client-feature__quote { font-size: 22px; } }
.client-feature__author {
  display: flex; align-items: center; gap: 12px;
  padding-top: 16px; border-top: 1px solid var(--faint);
  flex-wrap: wrap;
}
.client-feature__avatar {
  width: 48px; height: 48px; border-radius: 50%;
  background: var(--sand);
  display: flex; align-items: center; justify-content: center;
  font: 500 16px 'Manrope', sans-serif; color: var(--navy);
  flex-shrink: 0;
}
@media (max-width: 768px) {
  .client-feature__avatar { width: 40px; height: 40px; font-size: 14px; }
}
.client-feature__link {
  margin-left: auto;
  font: 500 11px 'JetBrains Mono', monospace; letter-spacing: 0.14em;
  color: var(--terra); text-decoration: none;
}

/* ── Home: How we work (values on navy) ── */
.home-values {
  display: grid; grid-template-columns: 1fr; gap: 36px;
}
@media (min-width: 769px) {
  .home-values { grid-template-columns: repeat(3, 1fr); gap: 56px; }
}
.home-values__num {
  font: 400 64px 'Instrument Serif', Georgia, serif;
  color: var(--terra); line-height: 1; margin-bottom: 14px; opacity: 0.95;
}
@media (max-width: 768px) { .home-values__num { font-size: 44px; } }
.home-values__title {
  font: 500 22px 'Manrope', sans-serif;
  color: var(--paper); margin-bottom: 10px; letter-spacing: -0.01em;
}
@media (max-width: 768px) { .home-values__title { font-size: 18px; } }
.home-values__body {
  font: 400 15px 'Manrope', sans-serif;
  color: var(--paper); opacity: 0.78; line-height: 1.6;
}
@media (max-width: 768px) { .home-values__body { font-size: 14px; } }

/* ── Home: Lead capture inline ── */
.lead-capture {
  max-width: 640px; margin: 0 auto; text-align: center;
}
.lead-capture__title {
  font: 400 36px 'Instrument Serif', Georgia, serif;
  color: var(--navy); line-height: 1.2; margin: 12px 0;
}
@media (max-width: 768px) { .lead-capture__title { font-size: 26px; } }
.lead-capture__lede {
  font: 400 16px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.65;
  line-height: 1.6; margin-bottom: 28px;
}
@media (max-width: 768px) { .lead-capture__lede { font-size: 14px; } }
.lead-capture__form {
  display: flex; gap: 10px; justify-content: center;
  flex-direction: row; max-width: 480px; margin: 0 auto;
  flex-wrap: wrap;
}
@media (max-width: 600px) {
  .lead-capture__form { flex-direction: column; }
}
.lead-capture__form input {
  font: 400 14px 'Manrope', sans-serif;
  padding: 13px 18px; border: 1px solid var(--faint);
  background: var(--paper); color: var(--navy);
  outline: none; flex: 1; min-width: 0;
}
.lead-capture__form button {
  border: none; cursor: pointer; white-space: nowrap;
}
.lead-capture__success {
  font: 400 15px 'Manrope', sans-serif; color: var(--navy);
  padding: 16px 24px; background: var(--paper);
  border: 1px solid var(--faint); display: inline-block;
}
.lead-capture__disclaimer {
  font: 400 11px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.35; margin-top: 12px;
}

/* ── Home: CTA final with image background ── */
.home-cta { position: relative; overflow: hidden; }
.home-cta__bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center right;
}
.home-cta__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    to right,
    var(--cream) 0%, var(--cream) 30%,
    rgba(235, 229, 215, 0.87) 45%,
    rgba(235, 229, 215, 0.4) 60%,
    transparent 80%
  );
}
@media (max-width: 768px) {
  .home-cta__overlay {
    background: linear-gradient(
      to bottom,
      var(--cream) 0%, rgba(235, 229, 215, 0.93) 40%,
      rgba(235, 229, 215, 0.67) 70%, transparent 100%
    );
  }
}
.home-cta__inner {
  position: relative; padding: 120px 40px;
  display: grid; grid-template-columns: 1fr; gap: 80px;
  align-items: center;
}
@media (min-width: 769px) {
  .home-cta__inner { grid-template-columns: 1.2fr 1fr; padding: 120px 40px; }
}
@media (max-width: 768px) {
  .home-cta__inner { padding: 56px 20px 80px; }
}
.home-cta__h1 {
  font: 400 72px 'Instrument Serif', Georgia, serif;
  color: var(--navy); letter-spacing: -0.02em; line-height: 1.08;
  margin: 8px 0 0;
}
@media (max-width: 768px) { .home-cta__h1 { font-size: 40px; } }
.home-cta__lede {
  font: 400 17px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.8; line-height: 1.6;
  margin-top: 24px; max-width: 46ch;
}
@media (max-width: 768px) { .home-cta__lede { font-size: 15px; margin-top: 16px; } }
.home-cta__stamp {
  display: flex; justify-content: center;
}

/* ── Page Header (inner pages) ── */
/* ── Page Header (matches PageHeader component from React SPA) ── */
.page-header {
  padding: 64px 0 88px; border-bottom: 1px solid var(--faint);
}
@media (max-width: 768px) { .page-header { padding: 32px 0 48px; } }

.page-header__grid {
  display: grid; grid-template-columns: 1fr; gap: 16px;
  margin-top: 8px; align-items: end;
}
@media (min-width: 769px) {
  .page-header__grid { grid-template-columns: 1.3fr 1fr; gap: 64px; }
}

.page-header__h1 {
  font: 400 68px 'Instrument Serif', Georgia, serif;
  color: var(--navy); letter-spacing: -0.02em; line-height: 1.08;
  margin: 0; text-wrap: balance;
}
@media (max-width: 768px) { .page-header__h1 { font-size: 38px; } }

.page-header__lede {
  font: 400 19px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.78;
  line-height: 1.55; max-width: 55ch; margin: 0;
}
@media (max-width: 768px) { .page-header__lede { font-size: 16px; } }

/* ── Service rows (one per service, alternating bg) ── */
.service-row {
  padding: 72px 0;
}
.service-row--cream { background: var(--cream); }
@media (max-width: 768px) { .service-row { padding: 48px 0; } }

.service-row__grid {
  display: grid; grid-template-columns: 1fr; gap: 24px;
}
@media (min-width: 769px) {
  .service-row__grid { grid-template-columns: 0.8fr 1.5fr 0.8fr; gap: 64px; }
}

.service-row__head { display: block; }
@media (max-width: 768px) {
  .service-row__head { display: flex; align-items: baseline; gap: 16px; }
}

.service-row__num {
  font: 400 96px 'Instrument Serif', Georgia, serif;
  color: var(--terra); line-height: 0.9; opacity: 0.85;
  margin-bottom: 20px;
}
@media (max-width: 768px) { .service-row__num { font-size: 48px; margin-bottom: 0; } }

.service-row__eyebrow { margin-bottom: 0; }

.service-row__title {
  font: 400 36px 'Instrument Serif', Georgia, serif;
  color: var(--navy); letter-spacing: -0.015em; line-height: 1.12;
  margin: 0; text-wrap: balance;
}
@media (max-width: 768px) { .service-row__title { font-size: 26px; } }

.service-row__lead {
  font: 400 17px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.78; line-height: 1.55;
  margin: 16px 0 0; max-width: 50ch;
}
@media (max-width: 768px) { .service-row__lead { font-size: 15px; } }

.service-row__bullets {
  list-style: none; padding: 0; margin: 20px 0 0;
  display: flex; flex-direction: column; gap: 8px;
}
.service-row__bullets li {
  display: flex; gap: 12px;
  font: 400 14.5px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.85;
}
.service-row__bullets li span {
  font: 500 11px 'JetBrains Mono', monospace;
  color: var(--terra); margin-top: 4px; flex-shrink: 0;
}
@media (max-width: 768px) { .service-row__bullets li { font-size: 13.5px; } }

.service-row__side {
  border-left: 1px solid var(--faint); padding-left: 28px;
  display: flex; flex-direction: column; gap: 24px; align-items: flex-start;
}
@media (max-width: 768px) {
  .service-row__side {
    border-left: none; padding-left: 0;
    border-top: 1px solid var(--faint); padding-top: 20px;
    flex-direction: row; flex-wrap: wrap; gap: 20px; align-items: center;
  }
}

.service-row__meta-label {
  font: 500 10px 'JetBrains Mono', monospace; letter-spacing: 0.16em;
  text-transform: uppercase; opacity: 0.55; color: var(--navy);
  margin-bottom: 4px;
}
.service-row__meta-value {
  font: 500 22px 'Manrope', sans-serif; color: var(--navy);
}
.service-row__meta-value--sm { font-size: 16px; }
@media (max-width: 768px) {
  .service-row__meta-value { font-size: 18px; }
  .service-row__meta-value--sm { font-size: 14px; }
}

/* ── Regularización page — shared H2/links ── */
.reg-h2 {
  font: 400 40px 'Instrument Serif', Georgia, serif;
  color: var(--navy); letter-spacing: -0.015em; line-height: 1.12;
  margin: 0; text-wrap: balance;
}
.reg-h2--on-dark { color: var(--paper); }
@media (max-width: 768px) { .reg-h2 { font-size: 28px; } }

.reg-link { color: var(--terra); font-weight: 600; }
.eyebrow--on-dark { color: var(--paper); opacity: 0.55; }

.reg-prose {
  font: 400 17px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.8;
  line-height: 1.65; max-width: 55ch;
  margin: 14px 0 0;
}
@media (max-width: 768px) { .reg-prose { font-size: 15px; } }

/* ── Estimador (Calculator section) ── */
.reg-calc {
  padding: 96px 0; background: var(--cream);
}
@media (max-width: 768px) { .reg-calc { padding: 56px 0; } }
.reg-calc__grid {
  display: grid; grid-template-columns: 1fr; gap: 28px;
  align-items: start;
}
@media (min-width: 769px) {
  .reg-calc__grid { grid-template-columns: 1fr 1.6fr; gap: 64px; }
}
.reg-calc__intro { margin-bottom: 0; }
.reg-calc__lede {
  font: 400 16px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.78;
  line-height: 1.6; max-width: 40ch; margin: 16px 0 0;
}
@media (max-width: 768px) { .reg-calc__lede { font-size: 14px; } }

/* ── Qué es (with sticky sidebar) ── */
.reg-what { padding: 72px 0; }
@media (max-width: 768px) { .reg-what { padding: 48px 0; } }
.reg-what__grid {
  display: grid; grid-template-columns: 1fr; gap: 32px;
  align-items: start;
}
@media (min-width: 769px) {
  .reg-what__grid { grid-template-columns: 1.3fr 0.7fr; gap: 72px; }
}
.reg-callout {
  margin-top: 20px;
  padding: 20px 24px;
  background: var(--cream);
  border-left: 3px solid var(--terra);
}
.reg-callout p {
  margin: 0;
  font: 400 15px 'Manrope', sans-serif;
  color: var(--navy); line-height: 1.6;
}
@media (max-width: 768px) {
  .reg-callout { padding: 16px 18px; }
  .reg-callout p { font-size: 14px; }
}
.reg-aside {
  padding: 32px;
  background: var(--cream);
  border: 1px solid var(--faint);
  align-self: start;
  display: flex; flex-direction: column; gap: 14px;
}
@media (min-width: 769px) { .reg-aside { position: sticky; top: 96px; } }
@media (max-width: 768px) { .reg-aside { padding: 24px; } }
.reg-aside__title {
  font: 400 32px 'Instrument Serif', Georgia, serif;
  color: var(--navy); letter-spacing: -0.01em; line-height: 1.15;
}
@media (max-width: 768px) { .reg-aside__title { font-size: 24px; } }
.reg-aside__lede {
  font: 400 14.5px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.75; line-height: 1.6;
  margin: 0 0 6px;
}
.reg-aside__list {
  list-style: none; padding: 0; margin: 6px 0 0;
  display: flex; flex-direction: column; gap: 8px;
}
.reg-aside__list li {
  display: flex; gap: 10px;
  font: 400 13.5px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.85;
}
.reg-aside__list li span {
  color: var(--terra); font-weight: 700;
}

/* ── Por qué regularizar (reasons) ── */
.reg-reasons { padding: 72px 0; background: var(--cream); }
@media (max-width: 768px) { .reg-reasons { padding: 48px 0; } }
.reg-reasons__grid {
  display: grid; grid-template-columns: 1fr; gap: 16px;
  margin-top: 24px;
}
@media (min-width: 769px) {
  .reg-reasons__grid { grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 36px; }
}
.reg-reason {
  display: flex; gap: 16px;
  padding: 28px;
  background: var(--paper);
  border: 1px solid var(--faint);
}
@media (max-width: 768px) { .reg-reason { padding: 20px; } }
.reg-reason__num {
  font: 400 40px 'Instrument Serif', Georgia, serif;
  color: var(--terra); line-height: 1; opacity: 0.85;
  flex-shrink: 0;
}
.reg-reason__title {
  font: 600 16px 'Manrope', sans-serif;
  color: var(--navy); margin-bottom: 6px;
}
.reg-reason__body {
  font: 400 14px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.7; line-height: 1.6;
}

/* ── Proceso 5 pasos (dark section) ── */
.reg-steps { padding: 96px 0; }
@media (max-width: 768px) { .reg-steps { padding: 56px 0; } }
.reg-steps__lede {
  font: 400 17px 'Manrope', sans-serif;
  color: var(--paper); opacity: 0.72;
  line-height: 1.6; max-width: 55ch;
  margin: 16px 0 0;
}
@media (max-width: 768px) { .reg-steps__lede { font-size: 15px; } }
.reg-steps__grid {
  display: grid; grid-template-columns: 1fr; gap: 28px;
  margin-top: 32px;
}
@media (min-width: 769px) {
  .reg-steps__grid { grid-template-columns: repeat(5, 1fr); gap: 32px; margin-top: 56px; }
}
.reg-step__num {
  font: 400 56px 'Instrument Serif', Georgia, serif;
  color: var(--terra); line-height: 1; opacity: 0.9;
  margin-bottom: 10px;
}
@media (max-width: 768px) { .reg-step__num { font-size: 40px; } }
.reg-step__title {
  font: 600 17px 'Manrope', sans-serif;
  color: var(--paper); margin-bottom: 4px;
}
@media (max-width: 768px) { .reg-step__title { font-size: 16px; } }
.reg-step__time {
  font: 500 12px 'JetBrains Mono', monospace;
  color: var(--terra); opacity: 0.85;
  margin-bottom: 10px;
}
.reg-step__body {
  font: 400 14px 'Manrope', sans-serif;
  color: var(--paper); opacity: 0.72; line-height: 1.6;
}
@media (max-width: 768px) { .reg-step__body { font-size: 13px; } }

/* ── Detalle por etapa (table) ── */
.reg-table-section { padding: 96px 0; }
@media (max-width: 768px) { .reg-table-section { padding: 56px 0; } }
.reg-table-section__grid {
  display: grid; grid-template-columns: 1fr; gap: 28px;
}
@media (min-width: 769px) {
  .reg-table-section__grid { grid-template-columns: 0.7fr 1fr; gap: 64px; }
}
.reg-table-section__lede {
  font: 400 16px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.78; line-height: 1.6;
  max-width: 40ch; margin: 16px 0 0;
}
@media (max-width: 768px) { .reg-table-section__lede { font-size: 14px; } }
.reg-table-wrap { overflow-x: auto; }
.reg-table { border-collapse: collapse; width: 100%; min-width: 100%; }
@media (max-width: 768px) { .reg-table { min-width: 420px; } }
.reg-table thead tr { border-bottom: 1.5px solid var(--navy); }
.reg-table th {
  text-align: left; padding: 10px 0;
  font: 500 10px 'JetBrains Mono', monospace;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--navy); opacity: 0.7;
}
.reg-table tbody tr { border-bottom: 1px solid var(--faint); }
.reg-table td { padding: 18px 12px 18px 0; vertical-align: top; }
.reg-table td + td { padding-left: 12px; padding-right: 12px; }
.reg-table td:last-child { padding-right: 0; }
@media (max-width: 768px) {
  .reg-table td { padding: 12px 12px 12px 0; }
}
.reg-table__num {
  font: 500 11px 'JetBrains Mono', monospace;
  color: var(--terra); margin-bottom: 4px;
}
.reg-table__title {
  font: 500 17px 'Manrope', sans-serif;
  color: var(--navy); letter-spacing: -0.01em;
}
@media (max-width: 768px) { .reg-table__title { font-size: 15px; } }
.reg-table__time {
  font: 500 14px 'Manrope', sans-serif;
  color: var(--navy); white-space: nowrap;
}
@media (max-width: 768px) { .reg-table__time { font-size: 13px; } }
.reg-table__who {
  font: 400 14px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.75;
}
@media (max-width: 768px) { .reg-table__who { font-size: 13px; } }

/* ── Plazos y costos ── */
.reg-costs { padding: 64px 0; background: var(--cream); }
@media (max-width: 768px) { .reg-costs { padding: 48px 0; } }
.reg-costs__grid {
  display: grid; grid-template-columns: 1fr; gap: 16px;
  margin-top: 24px;
}
@media (min-width: 769px) {
  .reg-costs__grid { grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 36px; }
}
.reg-cost {
  padding: 28px;
  background: var(--paper);
  border: 1px solid var(--faint);
}
@media (max-width: 768px) { .reg-cost { padding: 20px; } }
.reg-cost__label {
  font: 500 10px 'JetBrains Mono', monospace;
  letter-spacing: 0.16em; text-transform: uppercase;
  opacity: 0.55; color: var(--navy); margin-bottom: 6px;
}
.reg-cost__value {
  font: 400 36px 'Instrument Serif', Georgia, serif;
  color: var(--navy); margin-bottom: 6px; line-height: 1.05;
}
@media (max-width: 768px) { .reg-cost__value { font-size: 28px; } }
.reg-cost__sub {
  font: 400 13.5px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.65;
}
.reg-costs__foot {
  font: 400 15px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.75;
  line-height: 1.6; max-width: 65ch; margin-top: 24px;
}

/* ── Documentación ── */
.reg-docs { padding: 72px 0; }
@media (max-width: 768px) { .reg-docs { padding: 48px 0; } }
.reg-docs__lede {
  font: 400 16px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.78;
  line-height: 1.6; max-width: 55ch; margin-top: 14px;
}
@media (max-width: 768px) { .reg-docs__lede { font-size: 14px; } }
.reg-docs__grid {
  display: grid; grid-template-columns: 1fr; gap: 12px;
  margin-top: 20px;
}
@media (min-width: 769px) {
  .reg-docs__grid { grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 32px; }
}
.reg-doc {
  padding: 24px;
  border: 1px solid var(--faint);
  background: var(--cream);
}
@media (max-width: 768px) { .reg-doc { padding: 18px; } }
.reg-doc__code {
  font: 500 11px 'JetBrains Mono', monospace;
  letter-spacing: 0.14em; color: var(--terra);
  margin-bottom: 8px;
}
.reg-doc__name {
  font: 600 16px 'Manrope', sans-serif;
  color: var(--navy); letter-spacing: -0.01em;
  margin-bottom: 6px;
}
@media (max-width: 768px) { .reg-doc__name { font-size: 15px; } }
.reg-doc__desc {
  font: 400 13.5px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.65;
}

/* ── FAQ section ── */
.reg-faq { padding: 72px 0; }
@media (max-width: 768px) { .reg-faq { padding: 48px 0; } }
.reg-faq__grid {
  display: grid; grid-template-columns: 1fr; gap: 24px;
}
@media (min-width: 769px) {
  .reg-faq__grid { grid-template-columns: 0.7fr 1fr; gap: 64px; }
}
.reg-faq__lede {
  font: 400 16px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.75;
  line-height: 1.6; margin-top: 14px;
}
@media (max-width: 768px) { .reg-faq__lede { font-size: 14px; } }
.reg-faq__list { display: flex; flex-direction: column; }
.reg-faq__list details { border-top: 1px solid var(--faint); padding: 20px 0; }
@media (max-width: 768px) { .reg-faq__list details { padding: 14px 0; } }
.reg-faq__list summary {
  font: 500 17px 'Manrope', sans-serif;
  color: var(--navy); cursor: pointer; list-style: none;
  display: flex; justify-content: space-between; gap: 16px;
  align-items: flex-start;
}
.reg-faq__list summary::-webkit-details-marker { display: none; }
@media (max-width: 768px) { .reg-faq__list summary { font-size: 15px; } }
.reg-faq__list summary span {
  font: 400 24px 'Instrument Serif', Georgia, serif;
  color: var(--terra); line-height: 1; flex-shrink: 0;
  width: 16px; text-align: center;
}
.reg-faq__list details[open] summary span { font-size: 0; }
.reg-faq__list details[open] summary span::before {
  content: '−'; font-size: 24px;
}
.reg-faq__list details p {
  font: 400 14.5px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.75;
  line-height: 1.65; margin-top: 10px;
}
@media (max-width: 768px) { .reg-faq__list details p { font-size: 13.5px; } }

/* ── Estudio page — bio section ── */
.estudio-bio { padding: 96px 0; }
@media (max-width: 768px) { .estudio-bio { padding: 56px 0; } }
.estudio-bio__grid {
  display: grid; grid-template-columns: 1fr; gap: 32px;
  align-items: center;
}
@media (min-width: 769px) {
  .estudio-bio__grid { grid-template-columns: 1fr 1fr; gap: 64px; }
}
.estudio-bio__figure { margin: 0; }
.estudio-bio__photo {
  aspect-ratio: 4/5; overflow: hidden;
  background: var(--cream);
}
.estudio-bio__photo img {
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.estudio-bio__caption {
  font: 500 10px 'JetBrains Mono', monospace;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--navy); opacity: 0.55;
  margin-top: 10px;
}
.estudio-bio__h2 {
  font: 400 40px 'Instrument Serif', Georgia, serif;
  color: var(--navy); letter-spacing: -0.015em;
  line-height: 1.12; margin: 0; text-wrap: balance;
}
@media (max-width: 768px) { .estudio-bio__h2 { font-size: 28px; } }
.estudio-bio__p {
  font: 400 17px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.8;
  line-height: 1.6; max-width: 50ch;
  margin: 18px 0 0;
}
@media (max-width: 768px) { .estudio-bio__p { font-size: 15px; } }
.estudio-bio__p + .estudio-bio__p { margin-top: 14px; }

/* ── Estudio page — values (navy) ── */
.estudio-values { padding: 120px 0; }
@media (max-width: 768px) { .estudio-values { padding: 64px 0; } }
.estudio-values__h2 {
  font: 400 48px 'Instrument Serif', Georgia, serif;
  color: var(--paper); letter-spacing: -0.015em;
  line-height: 1.1; margin: 0; text-wrap: balance;
}
@media (max-width: 768px) { .estudio-values__h2 { font-size: 32px; } }
.estudio-values__grid {
  display: grid; grid-template-columns: 1fr; gap: 36px;
  margin-top: 56px;
}
@media (min-width: 769px) {
  .estudio-values__grid { grid-template-columns: repeat(3, 1fr); gap: 48px; }
}
@media (max-width: 768px) {
  .estudio-values__grid { margin-top: 36px; }
}
.estudio-value__num {
  font: 400 56px 'Instrument Serif', Georgia, serif;
  color: var(--terra); line-height: 1; opacity: 0.9;
  margin-bottom: 12px;
}
@media (max-width: 768px) { .estudio-value__num { font-size: 40px; } }
.estudio-value__title {
  font: 600 20px 'Manrope', sans-serif;
  color: var(--paper); letter-spacing: -0.01em;
  margin-bottom: 10px;
}
@media (max-width: 768px) { .estudio-value__title { font-size: 17px; } }
.estudio-value__body {
  font: 400 14.5px 'Manrope', sans-serif;
  color: var(--paper); opacity: 0.78; line-height: 1.6;
}
@media (max-width: 768px) { .estudio-value__body { font-size: 13.5px; } }
.estudio-values__cta {
  text-align: center; margin-top: 64px;
}
@media (max-width: 768px) { .estudio-values__cta { margin-top: 40px; } }

/* ── Contacto page ── */
.contact-section { padding: 88px 0; }
@media (max-width: 768px) { .contact-section { padding: 48px 0; } }
.contact-grid {
  display: grid; grid-template-columns: 1fr; gap: 40px;
}
@media (min-width: 769px) {
  .contact-grid { grid-template-columns: 1.2fr 1fr; gap: 80px; }
}
.contact-form {
  display: flex; flex-direction: column; gap: 20px;
}
.contact-row {
  display: grid; grid-template-columns: 1fr; gap: 20px;
}
@media (min-width: 769px) {
  .contact-row { grid-template-columns: 1fr 1fr; }
}
.contact-field {
  display: flex; flex-direction: column; gap: 8px;
}
.contact-field__label {
  font: 500 11px 'JetBrains Mono', monospace;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--navy); opacity: 0.65;
}
.contact-field__input {
  font: 400 15px 'Manrope', sans-serif;
  color: var(--navy);
  padding: 12px 0;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--navy);
  outline: none;
  width: 100%;
  border-radius: 0;
}
.contact-field__input::placeholder {
  color: var(--navy); opacity: 0.4;
}
.contact-field__input:focus {
  border-bottom-color: var(--terra);
}
.contact-field__select { appearance: none; cursor: pointer; }
.contact-field__textarea { resize: vertical; min-height: 100px; }
.contact-form__actions {
  margin-top: 12px;
  display: flex; gap: 14px; align-items: center; flex-wrap: wrap;
}
.contact-form__actions .btn { border: none; cursor: pointer; }
.contact-form__hint {
  font: 400 12.5px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.6;
}
.contact-form__hint a {
  color: var(--navy); text-decoration: underline;
}

/* ── Contact info column ── */
.contact-info { display: block; }
.contact-block {
  padding: 20px 0;
  border-bottom: 1px solid var(--faint);
}
.contact-block__label {
  font: 500 10.5px 'JetBrains Mono', monospace;
  letter-spacing: 0.16em; text-transform: uppercase;
  opacity: 0.55; color: var(--navy);
  margin-bottom: 6px;
}
.contact-block__value {
  font: 500 20px 'Manrope', sans-serif;
  color: var(--navy); letter-spacing: -0.01em;
}
.contact-block__value a {
  color: var(--navy); text-decoration: none;
}
.contact-block__value a:hover { color: var(--terra); }
.contact-block__sub {
  font: 400 13px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.65;
  margin-top: 4px;
}
.contact-guarantee {
  margin-top: 32px;
  padding: 24px;
  background: var(--cream);
  border: 1px solid var(--faint);
}
.contact-guarantee__label {
  font: 500 11px 'JetBrains Mono', monospace;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--terra); margin-bottom: 10px;
}
.contact-guarantee p {
  font: 400 14.5px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.85;
  line-height: 1.6; margin: 0;
}

/* ── Service page CTA ── */
.service-cta { padding: 80px 0; }
@media (max-width: 768px) { .service-cta { padding: 56px 0; } }
.service-cta__inner {
  text-align: center; max-width: 560px; margin: 0 auto;
}
.service-cta__lede {
  font: 400 17px 'Manrope', sans-serif;
  color: var(--paper); opacity: 0.72;
  line-height: 1.6; margin: 18px 0 32px;
}
@media (max-width: 768px) { .service-cta__lede { font-size: 15px; } }
.service-cta__actions {
  display: flex; gap: 14px; justify-content: center; flex-wrap: wrap;
}

/* ── Utilities ── */
.opacity-70 { opacity: 0.7; }
.opacity-75 { opacity: 0.75; }
.opacity-80 { opacity: 0.8; }
.mt-0 { margin-top: 0; }
.mt-1 { margin-top: 16px; }
.mt-2 { margin-top: 24px; }
.mt-3 { margin-top: 32px; }
.mt-4 { margin-top: 48px; }
.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: 16px; }
.mb-2 { margin-bottom: 24px; }
.mb-3 { margin-bottom: 32px; }
.hidden-mobile { display: none; }
@media (min-width: 769px) { .hidden-mobile { display: block; } }
.hidden-desktop { display: block; }
@media (min-width: 769px) { .hidden-desktop { display: none; } }

/* ── Regularization Calculator ── */
.pp-calc-wrap {
  background: var(--paper); border: 1.5px solid var(--navy);
  padding: 36px 40px 40px; position: relative;
  box-shadow: 12px 12px 0 0 rgba(27,40,69,0.08);
}
@media (max-width: 768px) { .pp-calc-wrap { padding: 24px 18px 28px; box-shadow: 6px 6px 0 0 rgba(27,40,69,0.08); } }
.pp-calc-tag {
  font: 500 11px 'JetBrains Mono', monospace; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--terra); margin-bottom: 6px;
}
.pp-calc-title {
  font: 400 32px 'Instrument Serif', Georgia, serif;
  color: var(--navy); line-height: 1.05; letter-spacing: -0.01em; margin-bottom: 6px;
}
@media (max-width: 768px) { .pp-calc-title { font-size: 24px; } }
.pp-calc-sub {
  font: 400 14px 'Manrope', sans-serif; color: var(--navy);
  opacity: 0.7; margin-bottom: 28px;
}
.pp-calc-label {
  font: 500 11px 'JetBrains Mono', monospace; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--navy); opacity: 0.65;
}
.pp-calc-slider-block { margin-bottom: 28px; }
.pp-calc-slider-row {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 10px;
}
.pp-calc-value {
  font: 500 22px 'Manrope', sans-serif; color: var(--navy); letter-spacing: -0.01em;
}
.pp-calc-unit { font: 400 13px 'JetBrains Mono', monospace; opacity: 0.6; }
.pp-calc-slider-minmax {
  display: flex; justify-content: space-between;
  font: 400 10px 'JetBrains Mono', monospace;
  color: var(--navy); opacity: 0.4; margin-top: 4px;
}
.pp-calc-types-block { margin-bottom: 28px; }
.pp-calc-types { display: flex; gap: 8px; flex-wrap: wrap; }
.pp-calc-types button {
  font: 500 13px 'Manrope', sans-serif;
  color: var(--navy); background: transparent;
  border: 1px solid var(--navy); padding: 9px 16px; cursor: pointer;
  transition: background .15s, color .15s;
}
.pp-calc-types button.active, .pp-calc-types button:hover { background: var(--navy); color: var(--paper); }
.pp-calc-result {
  display: grid; grid-template-columns: 1.4fr 1fr;
  border-top: 1px solid var(--navy); border-bottom: 1px solid var(--navy);
}
@media (max-width: 768px) { .pp-calc-result { grid-template-columns: 1fr; } }
.pp-calc-cell { padding: 20px 24px 18px; border-right: 1px solid var(--faint); }
.pp-calc-cell--last { border-right: none; }
@media (max-width: 768px) {
  .pp-calc-cell { padding: 14px 0 12px; border-right: none; border-bottom: 1px solid var(--faint); }
  .pp-calc-cell--last { border-bottom: none; }
}
.pp-calc-cell-value {
  font: 500 18px 'Manrope', sans-serif; color: var(--navy);
  letter-spacing: -0.01em; line-height: 1.1; margin-top: 6px;
}
.pp-calc-cell--big .pp-calc-cell-value { font-size: 24px; }
@media (max-width: 768px) { .pp-calc-cell--big .pp-calc-cell-value { font-size: 20px; } .pp-calc-cell-value { font-size: 16px; } }
.pp-calc-cell-sub { font: 400 12px 'Manrope', sans-serif; color: var(--navy); opacity: 0.6; margin-top: 4px; }
.pp-calc-toggle {
  background: none; border: none; cursor: pointer; padding: 14px 0 4px;
  font: 500 11px 'JetBrains Mono', monospace; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--terra); display: flex; align-items: center; gap: 6px;
}
.pp-calc-breakdown table { width: 100%; border-collapse: collapse; margin-top: 4px; margin-bottom: 8px; }
.pp-calc-breakdown td { padding: 10px 0; font: 400 13px 'Manrope', sans-serif; color: var(--navy); }
.pp-calc-breakdown td:nth-child(2) { font: 400 11px 'JetBrains Mono', monospace; opacity: 0.5; text-align: center; padding: 10px 8px; }
.pp-calc-breakdown td:last-child { font-weight: 500; text-align: right; font-size: 14px; }
.pp-calc-breakdown tr { border-bottom: 1px solid var(--faint); }
.pp-calc-breakdown .pp-calc-total-row { border-top: 1.5px solid var(--navy); border-bottom: none; }
.pp-calc-breakdown .pp-calc-total-row td:last-child { color: var(--terra); font-weight: 600; font-size: 15px; }
.pp-calc-footer {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 16px; gap: 16px; flex-wrap: wrap;
}
.pp-calc-disclaimer {
  font: 400 12px 'Manrope', sans-serif; color: var(--navy);
  opacity: 0.55; max-width: 55ch; line-height: 1.5;
}

/* ── Expediente Card ── */
/* ── Proyectos page — filters bar ── */
.proj-filters {
  padding: 48px 0;
  background: var(--cream);
  border-bottom: 1px solid var(--faint);
}
@media (max-width: 768px) { .proj-filters { padding: 32px 0; } }
.proj-filters__row {
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 12px;
}
.proj-filters__chips {
  display: flex; gap: 6px; flex-wrap: wrap;
}
.proj-chip {
  font: 500 13px 'Manrope', sans-serif;
  color: var(--navy); background: transparent;
  border: 1px solid var(--navy);
  padding: 9px 18px; cursor: pointer;
  letter-spacing: 0.01em;
  transition: background .15s, color .15s;
}
.proj-chip:hover { background: var(--navy); color: var(--paper); }
.proj-chip.is-active { background: var(--navy); color: var(--paper); }
@media (max-width: 768px) {
  .proj-chip { font-size: 12px; padding: 7px 12px; }
}
.proj-filters__count {
  font: 500 11px 'JetBrains Mono', monospace;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--navy); opacity: 0.6;
}
@media (max-width: 768px) { .proj-filters__count { font-size: 9px; } }

/* ── Proyectos page — grid ── */
.proj-grid-section {
  padding: 64px 0; background: var(--cream);
}
@media (max-width: 768px) { .proj-grid-section { padding: 40px 0; } }
.proj-grid {
  display: grid; grid-template-columns: 1fr; gap: 20px;
}
@media (min-width: 769px) {
  .proj-grid { grid-template-columns: repeat(3, 1fr); gap: 28px; }
}

/* ── Expediente cards — refinements ── */
.expediente {
  background: var(--paper); border: 1px solid var(--navy);
  display: grid; grid-template-rows: auto auto auto auto auto;
}
.expediente__header {
  padding: 14px 20px; border-bottom: 1px solid var(--navy);
  display: flex; justify-content: space-between; align-items: baseline;
  font: 500 10.5px 'JetBrains Mono', monospace; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--navy);
}
.expediente__photo { position: relative; }
.expediente__stamp {
  position: absolute; top: 16px; right: 16px;
  transform: rotate(-8deg); z-index: 2; pointer-events: none;
}
.expediente__title { padding: 20px 20px 0; }
.expediente__title-h {
  font: 400 26px 'Instrument Serif', Georgia, serif;
  color: var(--navy); line-height: 1.15;
  letter-spacing: -0.01em; margin-bottom: 4px;
}
.expediente__title-city {
  font: 400 13px 'Manrope', sans-serif;
  color: var(--navy); opacity: 0.65;
}
.expediente__drawings {
  display: grid; grid-template-columns: 1fr 1fr;
  border-top: 1px solid var(--faint); margin-top: 16px;
}
.expediente__drawing { width: 100%; height: 80px; display: block; }
.expediente__drawing--plan { border-right: 1px solid var(--faint); }
.expediente__data {
  border-collapse: collapse; width: 100%; border-top: 1px solid var(--navy);
}
.expediente__data td {
  padding: 9px 20px;
  font: 500 13px 'Manrope', sans-serif; color: var(--navy);
}
.expediente__data td:first-child {
  font: 500 10px 'JetBrains Mono', monospace; letter-spacing: 0.14em;
  text-transform: uppercase; opacity: 0.55; width: 40%;
}
.expediente__data td:last-child { text-align: right; }
.expediente__data tr { border-bottom: 1px solid var(--faint); }
.expediente__data tr:last-child { border-bottom: none; }

/* ── Before/After Slider (slick-image-compare wrapper) ── */
.pp-sic {
  width: 100%; aspect-ratio: 4/3;
  background: var(--cream); overflow: hidden;
}
.pp-sic img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ── Stamp ── */
.stamp {
  width: 160px; height: 160px; border: 3px solid var(--ink);
  border-radius: 50%; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center;
  transform: rotate(-8deg);
}
.stamp__text { font: 700 18px 'Manrope', sans-serif; letter-spacing: 0.12em; text-transform: uppercase; }
.stamp__sub { font: 500 8px 'JetBrains Mono', monospace; letter-spacing: 0.2em; text-transform: uppercase; opacity: 0.6; margin-top: 4px; }