/* ==========================================================================
   Comercio Inmobiliario — pages.css (Nosotros, Servicios, Desocupaciones,
   Reparaciones). Escritorio exacto del Figma en unidades u desde 1200px.
   ========================================================================== */

/* ─── Nosotros ─────────────────────────────────────────────────────────── */
.ci-nosotros__intro { background: var(--ci-gray-50); }
.ci-nosotros__hero { margin: 0; border-radius: calc(60 * var(--u)); overflow: hidden; box-shadow: 0 calc(48 * var(--u)) calc(100 * var(--u)) rgba(0, 0, 0, .3); background: var(--ci-gray-100); }
.ci-nosotros__hero img { display: block; width: 100%; height: auto; }
.ci-nosotros__label { margin: 0; font-size: calc(55 * var(--th)); font-weight: 400; line-height: 1.03; color: var(--ci-navy); }
.ci-nosotros__cols { display: grid; grid-template-columns: calc(856 * var(--u)) calc(770 * var(--u)); column-gap: calc(20 * var(--u)); align-items: start; }
.ci-nosotros__title { display: grid; margin: 0; font-size: calc(94 * var(--th)); font-weight: 400; line-height: 1.07; letter-spacing: .16px; text-transform: uppercase; color: var(--ci-navy); }
.ci-nosotros__title-2 { font-weight: 700; }
.ci-nosotros__text { font-size: calc(27 * var(--b)); font-weight: 300; line-height: 1.2; color: var(--ci-gray-600); }
.ci-nosotros__text p { margin: 0 0 calc(32 * var(--u)); }
.ci-nosotros__text p:last-child { margin-bottom: 0; }
.ci-nosotros__text--wide { max-width: none; }
.ci-nosotros__filosofia { background: var(--ci-white); }
.ci-nosotros__filosofia .ci-container, .ci-nosotros__pilares .ci-container { border-top: 1px solid #d9d9d9; }
.ci-nosotros__h2 { margin: 0; font-size: calc(80 * var(--th)); font-weight: 400; line-height: 1.03; text-transform: uppercase; color: var(--ci-navy); }
.ci-nosotros__h3 { margin: 0; font-size: calc(55 * var(--th)); font-weight: 400; line-height: 1.03; color: var(--ci-gray-600); }
.ci-nosotros__pilares { background: var(--ci-gray-50); }
.ci-nosotros__cols--pilares { grid-template-columns: calc(816 * var(--u)) calc(816 * var(--u)); column-gap: calc(59 * var(--u)); }
.ci-nosotros__panorama { line-height: 0; background: var(--ci-navy); }
.ci-nosotros__panorama img { width: 100%; height: auto; display: block; }

@media (min-width: 1200px) {
  /* Figma: foto 458→872 (franja termina en 658), "Nosotros" 922, título 1027, gris hasta 1546, filosofía 1633/1750, pilares 1987/2081/2149, gris hasta 2469 */
  .ci-nosotros__intro { padding-bottom: calc(117 * var(--u)); }
  .ci-nosotros__hero { margin-top: calc(-200 * var(--u)); height: calc(414 * var(--u)); }
  .ci-nosotros__label { margin: calc(50 * var(--u)) 0 calc(48 * var(--u)); }
  .ci-nosotros__intro .ci-nosotros__text { margin-top: calc(-1 * var(--u)); }
  .ci-nosotros__filosofia .ci-container { padding-top: calc(87 * var(--u)); padding-bottom: calc(103 * var(--u)); }
  .ci-nosotros__filosofia .ci-nosotros__h2 { margin-bottom: calc(35 * var(--u)); }
  .ci-nosotros__pilares .ci-container { padding-top: calc(68 * var(--u)); padding-bottom: calc(92 * var(--u)); }
  .ci-nosotros__pilar .ci-nosotros__h2 { margin-bottom: calc(12 * var(--u)); }
  .ci-nosotros__pilar .ci-nosotros__h3 { margin-bottom: calc(11 * var(--u)); }
}

@media (max-width: 1199px) {
  .ci-nosotros__intro { padding: var(--ci-sp-6) 0 var(--ci-sp-7); }
  .ci-nosotros__hero { border-radius: var(--ci-radius-lg); box-shadow: var(--ci-shadow-lg); aspect-ratio: 1702 / 414; }
  .ci-nosotros__hero img { height: 100%; object-fit: cover; }
  .ci-nosotros__label { margin: var(--ci-sp-6) 0 var(--ci-sp-4); font-size: var(--ci-fs-xl); }
  .ci-nosotros__cols { grid-template-columns: minmax(0, 1fr); gap: var(--ci-sp-5); }
  @media (min-width: 900px) { .ci-nosotros__cols { grid-template-columns: 1fr 1fr; gap: var(--ci-sp-6); } }
  .ci-nosotros__title { font-size: var(--ci-fs-2xl); letter-spacing: 0; }
  .ci-nosotros__text { font-size: var(--ci-fs-base); }
  .ci-nosotros__text p { margin-bottom: var(--ci-sp-4); }
  .ci-nosotros__filosofia .ci-container, .ci-nosotros__pilares .ci-container { padding-top: var(--ci-sp-7); padding-bottom: var(--ci-sp-7); }
  .ci-nosotros__h2 { font-size: var(--ci-fs-2xl); margin-bottom: var(--ci-sp-4); }
  .ci-nosotros__h3 { font-size: var(--ci-fs-xl); margin-bottom: var(--ci-sp-3); }
  .ci-nosotros__panorama img { min-height: 120px; object-fit: cover; }
}

/* ─── Servicios (una página por servicio) ──────────────────────────────── */
.ci-servicio-page { background: var(--ci-gray-50); }
.ci-servicio-page__hero { margin: 0; border-radius: calc(60 * var(--u)); overflow: hidden; box-shadow: 0 calc(48 * var(--u)) calc(100 * var(--u)) rgba(0, 0, 0, .3); background: var(--ci-gray-100); line-height: 0; }
.ci-servicio-page__hero img { width: 100%; height: auto; }
.ci-servicio-page__cols { display: grid; grid-template-columns: calc(779 * var(--u)) calc(772 * var(--u)); column-gap: calc(97 * var(--u)); align-items: start; }
.ci-servicio-page__title { margin: 0; font-size: calc(94 * var(--th)); font-weight: 400; line-height: 1.07; text-transform: uppercase; color: var(--ci-navy); }
.ci-servicio-page__subtitle { margin: calc(25 * var(--u)) 0 0; font-size: calc(55 * var(--th)); font-weight: 300; line-height: 1.2; color: var(--ci-gray-600); }
.ci-servicio-page__text { font-size: calc(27 * var(--b)); font-weight: 300; line-height: 1.2; color: var(--ci-gray-600); }
.ci-servicio-page__text p { margin: 0 0 calc(32 * var(--u)); }
.ci-servicio-page__text p:last-child { margin-bottom: 0; }
.ci-servicio-page__list { margin: calc(28 * var(--u)) 0 0; padding: 0; list-style: none; line-height: 1.53; }
.ci-servicio-page__list li { position: relative; padding-left: calc(25 * var(--u)); }
.ci-servicio-page__list li::before { content: "•"; position: absolute; left: 0; }

@media (min-width: 1200px) {
  /* Figma Servicios 1: foto 458→1102, título 1178 (76 bajo la foto), texto 1176, Contáctanos 210 bajo el bloque */
  .ci-servicio-page__hero { margin-top: calc(-200 * var(--u)); }
  .ci-servicio-page__cols { padding: calc(76 * var(--u)) 0 calc(290 * var(--u)); }
  .ci-servicio-page__text { margin-top: calc(-2 * var(--u)); }
}

@media (max-width: 1199px) {
  .ci-servicio-page__intro { padding: var(--ci-sp-6) 0 var(--ci-sp-7); }
  .ci-servicio-page__hero { border-radius: var(--ci-radius-lg); box-shadow: var(--ci-shadow-lg); }
  .ci-servicio-page__cols { grid-template-columns: minmax(0, 1fr); gap: var(--ci-sp-5); padding-top: var(--ci-sp-6); }
  @media (min-width: 900px) { .ci-servicio-page__cols { grid-template-columns: 1fr 1fr; gap: var(--ci-sp-6); } }
  .ci-servicio-page__title { font-size: var(--ci-fs-2xl); }
  .ci-servicio-page__subtitle { font-size: var(--ci-fs-xl); margin-top: var(--ci-sp-3); }
  .ci-servicio-page__text { font-size: var(--ci-fs-base); }
  .ci-servicio-page__text p { margin-bottom: var(--ci-sp-4); }
  .ci-servicio-page__list { margin-top: var(--ci-sp-4); }
  .ci-servicio-page__list li { padding-left: 16px; }
}

/* ─── Trámites: Desocupaciones y Reparaciones ──────────────────────────── */
.ci-band--cali .ci-band__bg img { opacity: 1; object-position: center top; }
.ci-band--cali .ci-band__bg::after { background: linear-gradient(180deg, rgba(0, 52, 118, .35) 0%, rgba(0, 52, 118, 0) 60%); }
.ci-tramite__top { background: var(--ci-gray-50); }
.ci-tramite__intro { display: grid; grid-template-columns: calc(772 * var(--u)) calc(824 * var(--u)); column-gap: calc(104 * var(--u)); align-items: start; }
.ci-tramite__title { margin: 0 0 calc(39 * var(--u)); font-size: calc(94 * var(--th)); font-weight: 400; line-height: 1.07; text-transform: uppercase; color: var(--ci-navy); }
.ci-tramite__lead { margin: 0; font-size: calc(27 * var(--b)); font-weight: 300; line-height: 1.2; color: var(--ci-gray-600); }
.ci-tramite__img { margin: 0; border-radius: calc(40 * var(--u)); overflow: hidden; line-height: 0; background: var(--ci-gray-100); box-shadow: 0 calc(15 * var(--u)) calc(40 * var(--u)) rgba(0, 0, 0, .25); }
.ci-tramite__img img { width: 100%; height: auto; }
.ci-tramite__h2 { display: flex; align-items: center; gap: calc(29 * var(--u)); margin: 0; font-size: calc(40 * var(--t)); font-weight: 500; line-height: 1.03; color: var(--ci-gray-600); }
.ci-tramite__arrow { width: 0; height: 0; border-left: calc(19.5 * var(--u)) solid transparent; border-right: calc(19.5 * var(--u)) solid transparent; border-top: calc(28 * var(--u)) solid var(--ci-navy); }
.ci-tramite__help { margin: 0; max-width: calc(730 * var(--u)); font-size: calc(24 * var(--b)); font-weight: 300; line-height: 1.2; color: var(--ci-gray-600); }
.ci-tramite__help strong { font-weight: 700; color: var(--ci-navy); }
.ci-tramite__panel { background: var(--ci-white); border-radius: calc(60 * var(--u)); box-shadow: 0 calc(48 * var(--u)) calc(100 * var(--u)) rgba(0, 0, 0, .3); }
.ci-tramite__form { display: grid; }
.ci-tramite__field { display: block; }
.ci-tramite__field > span { display: block; font-size: calc(28 * var(--b)); font-weight: 400; line-height: 1.28; color: var(--ci-navy); }
.ci-tramite__field input:not([type="file"]) {
  display: block; width: 100%; margin: 0; padding: 0 calc(30 * var(--u)); border: 0; border-radius: calc(31 * var(--u)); background: var(--ci-gray-50);
  font: inherit; font-size: calc(27 * var(--b)); color: var(--ci-gray-600);
}
.ci-tramite__field input:focus { outline: 2px solid var(--ci-navy); outline-offset: 1px; }
.ci-tramite__actions { display: flex; align-items: center; justify-content: space-between; gap: calc(40 * var(--u)); }
.ci-tramite__nota { margin: 0; max-width: calc(501 * var(--u)); font-size: calc(24 * var(--b)); font-weight: 300; line-height: 1.25; color: var(--ci-gray-600); }
.ci-tramite__nota strong { font-weight: 700; }
.ci-tramite__submit {
  display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: var(--ci-radius-pill); background: var(--ci-navy); color: var(--ci-white);
  font: inherit; font-size: calc(28 * var(--b)); cursor: pointer; box-shadow: 0 calc(10 * var(--u)) calc(30 * var(--u)) rgba(0, 52, 118, .5); transition: background var(--ci-ease);
}
.ci-tramite__submit:hover { background: var(--ci-navy-600); }
/* Zona de fotos (Reparaciones) */
.ci-dropzone { position: relative; display: grid; justify-items: center; text-align: center; border: 2px dashed #b5b5b5; border-radius: calc(30 * var(--u)); background: var(--ci-white); transition: background var(--ci-ease), border-color var(--ci-ease); }
.ci-dropzone.is-over { background: #eef3fa; border-color: var(--ci-navy); }
.ci-dropzone__icon { display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: #e5e5e5; color: var(--ci-gray-600); }
.ci-dropzone__text { margin: 0; color: var(--ci-gray-400); line-height: 1.5; }
.ci-dropzone__btn { position: relative; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--ci-radius-pill); background: #bdbdbd; color: var(--ci-white); cursor: pointer; overflow: hidden; }
.ci-dropzone__btn input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.ci-dropzone.has-files .ci-dropzone__btn { background: var(--ci-navy); }
.ci-dropzone__list { margin: 0; padding: 0; list-style: none; color: var(--ci-navy); font-size: var(--ci-fs-sm); }
.ci-dropzone__list:empty { display: none; }
/* Parte inferior (Desocupaciones): PDF y pasos */
.ci-tramite__bottom { position: relative; z-index: 0; background: var(--ci-white); overflow: hidden; }
.ci-tramite__bottom--vacio::before { height: 100%; }
.ci-tramite__bottom::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: calc(247 * var(--u)); z-index: -1; background: var(--ci-gray-50); clip-path: polygon(0 0, 100% 0, 100% 100%); }
.ci-tramite__pdf-text { margin: 0; max-width: calc(837 * var(--u)); font-size: calc(27 * var(--b)); font-weight: 300; line-height: 1.2; color: var(--ci-gray-600); }
.ci-tramite__pdf-text strong { font-weight: 700; color: var(--ci-navy); }
.ci-tramite__pdf-row { display: flex; align-items: center; justify-content: space-between; gap: var(--ci-sp-4); }
.ci-tramite__download { display: inline-flex; align-items: center; justify-content: center; border-radius: var(--ci-radius-pill); background: var(--ci-navy); color: var(--ci-white); font-size: calc(35 * var(--t)); box-shadow: 0 calc(10 * var(--u)) calc(30 * var(--u)) rgba(0, 52, 118, .5); }
.ci-tramite__download:hover { background: var(--ci-navy-600); color: var(--ci-white); }
.ci-tramite__download[aria-disabled="true"] { opacity: .5; pointer-events: none; }
.ci-pasos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.ci-paso { position: relative; display: grid; justify-items: center; text-align: center; background: var(--ci-white); border-radius: calc(30 * var(--u)); box-shadow: 0 calc(12 * var(--u)) calc(40 * var(--u)) rgba(0, 0, 0, .12); }
.ci-paso__icon { display: inline-flex; align-items: center; justify-content: center; background: var(--ci-navy); color: var(--ci-white); border-radius: calc(20 * var(--u)); box-shadow: 0 calc(10 * var(--u)) calc(25 * var(--u)) rgba(0, 52, 118, .4); }
.ci-paso__icon .ci-icon { width: 46%; height: 46%; stroke-width: 1.6; }
.ci-paso__num { display: inline-flex; align-items: baseline; gap: calc(14 * var(--u)); line-height: 1; }
.ci-paso__num small { font-size: calc(40 * var(--t)); font-weight: 400; color: var(--ci-gray-600); }
.ci-paso__num strong { font-size: calc(100 * var(--th)); font-weight: 700; color: #b5b5b5; letter-spacing: -.01em; }
.ci-paso__text { font-size: calc(28 * var(--b)); font-weight: 400; line-height: 1.25; color: var(--ci-gray-600); }
.ci-tramite__respuesta { margin: 0; font-size: calc(40 * var(--t)); font-weight: 500; line-height: 1.03; color: var(--ci-gray-600); }

@media (min-width: 1200px) {
  /* Figma Desocupaciones: foto 701, título 889, h2 1383, ayuda 1465, panel 1633 (labels 1676, inputs 1723, paso 132), nota/Enviar 2483, panel fin 2621 */
  .ci-tramite__top { padding-bottom: calc(22 * var(--u)); }
  .ci-tramite__intro { padding-top: calc(43 * var(--u)); }
  .ci-tramite__intro-text { padding-top: calc(188 * var(--u)); }
  .ci-tramite__h2 { margin: calc(35 * var(--u)) 0 calc(41 * var(--u)) calc(47 * var(--u)); }
  .ci-tramite__help { margin-left: calc(57 * var(--u)); }
  .ci-tramite__panel { margin-top: calc(51 * var(--u)); padding: calc(43 * var(--u)) calc(36 * var(--u)) calc(66 * var(--u)); }
  .ci-tramite__form { row-gap: calc(23 * var(--u)); }
  .ci-tramite__field > span { margin: 0 0 calc(11 * var(--u)) calc(22 * var(--u)); }
  .ci-tramite__field input:not([type="file"]) { height: calc(62 * var(--c)); }
  .ci-tramite__actions { margin-top: calc(13 * var(--u)); padding-left: calc(28 * var(--u)); }
  .ci-tramite__submit { width: calc(1054 * var(--u)); height: calc(72 * var(--c)); }
  .ci-dropzone { min-height: calc(476 * var(--u)); padding: calc(48 * var(--u)) calc(40 * var(--u)); row-gap: calc(18 * var(--u)); align-content: center; }
  .ci-dropzone__icon { width: calc(100 * var(--u)); height: calc(100 * var(--u)); } .ci-dropzone__icon .ci-icon { width: 55%; height: 55%; }
  .ci-dropzone__text { font-size: calc(35 * var(--t)); }
  .ci-dropzone__btn { width: calc(336 * var(--u)); height: calc(72 * var(--c)); font-size: calc(28 * var(--b)); }
  /* Parte inferior: texto 2731 (88 bajo el gris), fila PDF 2982, panel 3091, tarjetas 3239 (515x344, icono -61), Paso 3370, texto 3459, respuesta 3667, panel fin 3759, footer 3912 */
  .ci-tramite__bottom { padding: calc(88 * var(--u)) 0 calc(153 * var(--u)); }
  .ci-tramite__bottom--vacio { padding: 0 0 calc(149 * var(--u)); }
  .ci-tramite__pdf-row { margin: calc(106 * var(--u)) 0 calc(12 * var(--u)); padding-left: calc(47 * var(--u)); }
  .ci-tramite__download { width: calc(282 * var(--u)); height: calc(72 * var(--c)); margin-right: calc(52 * var(--u)); }
  .ci-tramite__panel--pasos { margin-top: 0; padding: calc(148 * var(--u)) calc(50 * var(--u)) calc(51 * var(--u)); }
  .ci-pasos { column-gap: calc(28 * var(--u)); }
  .ci-paso { height: calc(344 * var(--u)); padding: calc(88 * var(--u)) calc(60 * var(--u)) 0; }
  .ci-paso__num { min-height: calc(70 * var(--u)); align-items: center; }
  .ci-paso__icon { position: absolute; top: calc(-61 * var(--u)); left: 50%; transform: translateX(-50%); width: calc(140 * var(--u)); height: calc(129 * var(--u)); }
  .ci-paso__text { margin-top: calc(8 * var(--u)); max-width: calc(382 * var(--u)); }
  .ci-tramite__respuesta { margin: calc(84 * var(--u)) 0 0 calc(62 * var(--u)); }
}

@media (max-width: 1199px) {
  .ci-tramite__top { padding: var(--ci-sp-6) 0 var(--ci-sp-7); }
  .ci-tramite__intro { grid-template-columns: minmax(0, 1fr); gap: var(--ci-sp-5); }
  @media (min-width: 900px) { .ci-tramite__intro { grid-template-columns: 1fr 1fr; align-items: center; gap: var(--ci-sp-6); } }
  .ci-tramite__title { font-size: var(--ci-fs-2xl); margin-bottom: var(--ci-sp-3); }
  .ci-tramite__lead, .ci-tramite__help, .ci-tramite__pdf-text, .ci-tramite__nota { font-size: var(--ci-fs-base); max-width: none; }
  .ci-tramite__img { border-radius: var(--ci-radius-lg); box-shadow: var(--ci-shadow); }
  .ci-tramite__h2 { gap: var(--ci-sp-3); margin: var(--ci-sp-6) 0 var(--ci-sp-3); font-size: var(--ci-fs-lg); }
  .ci-tramite__arrow { border-left-width: 12px; border-right-width: 12px; border-top-width: 16px; }
  .ci-tramite__panel { margin-top: var(--ci-sp-5); padding: var(--ci-sp-5) var(--ci-sp-4) var(--ci-sp-6); border-radius: var(--ci-radius-lg); box-shadow: var(--ci-shadow-lg); }
  .ci-tramite__form { row-gap: var(--ci-sp-4); }
  .ci-tramite__field > span { margin: 0 0 6px var(--ci-sp-3); font-size: var(--ci-fs-base); }
  .ci-tramite__field input:not([type="file"]) { height: 50px; padding: 0 var(--ci-sp-4); font-size: var(--ci-fs-base); border-radius: 25px; }
  .ci-tramite__actions { flex-direction: column; align-items: stretch; gap: var(--ci-sp-4); margin-top: var(--ci-sp-2); }
  .ci-tramite__submit { height: 54px; font-size: var(--ci-fs-md); }
  .ci-dropzone { min-height: 220px; padding: var(--ci-sp-5) var(--ci-sp-4); row-gap: var(--ci-sp-3); align-content: center; border-radius: var(--ci-radius); }
  .ci-dropzone__icon { width: 56px; height: 56px; } .ci-dropzone__icon .ci-icon { width: 28px; height: 28px; }
  .ci-dropzone__text { font-size: var(--ci-fs-base); }
  .ci-dropzone__btn { min-width: 180px; height: 48px; padding: 0 var(--ci-sp-5); font-size: var(--ci-fs-base); }
  .ci-tramite__bottom { padding: var(--ci-sp-7) 0 var(--ci-sp-8); }
  .ci-tramite__bottom--vacio { padding: 0 0 var(--ci-sp-6); }
  .ci-tramite__bottom::before { display: none; }
  .ci-tramite__pdf-row { flex-wrap: wrap; margin: var(--ci-sp-4) 0 var(--ci-sp-5); }
  .ci-tramite__pdf-row .ci-tramite__h2 { margin: 0; }
  .ci-tramite__download { height: 50px; padding: 0 var(--ci-sp-6); font-size: var(--ci-fs-md); }
  .ci-tramite__panel--pasos { margin-top: 0; padding: var(--ci-sp-8) var(--ci-sp-4) var(--ci-sp-5); }
  .ci-pasos { grid-template-columns: minmax(0, 1fr); gap: 72px var(--ci-sp-4); }
  @media (min-width: 700px) { .ci-pasos { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  .ci-paso { padding: 64px var(--ci-sp-4) var(--ci-sp-5); border-radius: var(--ci-radius-lg); box-shadow: var(--ci-shadow); }
  .ci-paso__icon { position: absolute; top: -40px; left: 50%; transform: translateX(-50%); width: 88px; height: 80px; border-radius: 14px; }
  .ci-paso__num small { font-size: var(--ci-fs-lg); } .ci-paso__num strong { font-size: 56px; }
  .ci-paso__text { margin-top: var(--ci-sp-2); font-size: var(--ci-fs-base); }
  .ci-tramite__respuesta { margin: var(--ci-sp-6) 0 0; font-size: var(--ci-fs-lg); }
}