/* ============================================================ PROYECTO B - PACIFIC SOUL Identidad tomada de LLOSA-PACIFIC-SOUL-PAGINA-WEB: azul profundo del mar, fondo hueso y tipografia muy espaciada en mayusculas. Esta hoja SOLO se carga en /proyectos/proyecto-b/. Prefijo obligatorio de clases propias: .pb- Solo redefine variables --ficha-*. No toca los roles globales: la clase vive en el y repintaria la cabecera y el pie, que son compartidos con el resto del sitio. ============================================================ */ .ficha--proyecto-b { --ficha-color: var(--pacific-mar); --ficha-contraste: var(--blanco); --ficha-fondo: var(--pacific-hueso); --ficha-alterno: #e8e6e1; --ficha-borde: #d9d5cd; --ficha-borde-fuerte: #c2bcb1; --ficha-superficie: var(--blanco); --ficha-portada: linear-gradient(180deg, var(--pacific-profundo) 0%, var(--pacific-mar) 60%, #14536f 100%); } /* Los titulares de Pacific Soul van muy espaciados, casi susurrados */ .ficha--proyecto-b .ficha__portada h1 { font-family: var(--fuente-texto); font-weight: 300; letter-spacing: 0.22em; text-transform: uppercase; } .ficha--proyecto-b .ficha__lema { letter-spacing: 0.16em; text-transform: uppercase; font-size: var(--texto-sm); } .ficha--proyecto-b .seccion__etiqueta { color: var(--pacific-mar); } .ficha--proyecto-b .filete { color: var(--pacific-mar); } /* Onda suave sobre la portada */ .ficha--proyecto-b .ficha__portada-textura { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='80' viewBox='0 0 240 80'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='0.08' stroke-width='2'%3E%3Cpath d='M0 40c30-24 60-24 90 0s60 24 90 0 60-24 90 0'/%3E%3Cpath d='M0 64c30-24 60-24 90 0s60 24 90 0 60-24 90 0'/%3E%3C/g%3E%3C/svg%3E"); background-size: 240px 80px; } /* Las dos torres del proyecto, cada una con su direccion */ .pb-torres { display: grid; gap: var(--espacio-6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); } .pb-torre { padding: var(--espacio-7); background-color: var(--ficha-superficie); border-radius: var(--radio-lg); } .pb-torre h3 { margin-bottom: var(--espacio-2); font-family: var(--fuente-titulos); font-size: var(--texto-lg); color: var(--pacific-mar); } .pb-torre__direccion { margin-bottom: var(--espacio-5); font-family: var(--fuente-texto); font-size: var(--texto-xs); font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--color-texto-tenue); } .pb-torre .datos-icono { text-align: left; } .pb-torre .dato-icono svg { margin-inline: 0; } /* Cercania al malecon */ .pb-cercania { display: grid; gap: 0; list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ficha-borde); } .pb-cercania li { display: flex; align-items: center; justify-content: space-between; gap: var(--espacio-4); padding: var(--espacio-4) 0; border-bottom: 1px solid var(--ficha-borde); font-size: var(--texto-sm); transition: padding-left var(--transicion); } .pb-cercania li:hover { padding-left: var(--espacio-4); } .pb-cercania strong { white-space: nowrap; color: var(--pacific-mar); font-weight: 500; } /* Ajustes finos */ .ficha--proyecto-b .ficha__resumen-item dd { color: var(--pacific-mar); } .ficha--proyecto-b .galeria__item { background-color: var(--pacific-espuma); } .ficha--proyecto-b .dato-icono svg { color: var(--pacific-mar); }