/* Creathe — carrusel de proyectos (home). Hereda la fuente Borna de la página. */
.cp { background: #FFFFFF; padding: 0 0 clamp(64px, 8vw, 120px); color: #1D1D1D; }
.cp__head-wrap { max-width: 1248px; margin: 0 auto; padding: 0 24px; }
.cp__rule { height: 1px; background: #E3E1DC; margin-bottom: clamp(56px, 7vw, 100px); }
.cp__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px; }
.cp__intro { display: flex; flex-direction: column; gap: 20px; }
.cp__title { margin: 0; max-width: 50vw; font-size: clamp(34px, 4.2vw, 64px); font-weight: 500; line-height: 0.98; letter-spacing: -0.03em; text-wrap: balance; }
.cp__body { margin: 0; max-width: 44ch; font-size: clamp(16px, 1.3vw, 20px); line-height: 1.45; text-wrap: pretty; }
.cp__arrows { display: flex; gap: 10px; }
.cp__arrow { width: 48px; height: 48px; flex: none; display: inline-flex; align-items: center; justify-content: center; padding: 0; border-radius: 999px; background: #FFFFFF; border: 1px solid #E3E1DC; color: #1D1D1D; cursor: pointer; transition: border-color .18s ease, background .18s ease; }
.cp__arrow:hover { border-color: #6F60CC; background: #F3F1FB; }
.cp__arrow:focus-visible { outline: 2px solid #8E80DA; outline-offset: 2px; }
.cp__track { display: flex; gap: 24px; margin-top: clamp(40px, 5vw, 72px); padding-left: max(24px, calc((100% - 1200px) / 2)); padding-right: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-left: max(24px, calc((100% - 1200px) / 2)); scrollbar-width: none; }
.cp__track::-webkit-scrollbar { display: none; }
.cp__card { flex: 0 0 calc((100% - 24px) / 2.3); display: flex; flex-direction: column; gap: 18px; min-width: 0; color: #1D1D1D; text-decoration: none; scroll-snap-align: start; transition: opacity .18s ease; }
.cp__card:hover { opacity: 0.86; color: #1D1D1D; }
.cp__img { display: block; width: 100%; aspect-ratio: 1 / 1; height: auto; object-fit: cover; }
.cp__text { margin: 0; max-width: 52ch; font-size: clamp(15px, 1.15vw, 18px); line-height: 1.5; letter-spacing: -0.005em; text-wrap: pretty; }
.cp__tags { display: flex; flex-wrap: wrap; gap: 10px; }
.cp__tag { padding: 8px 20px; border-radius: 999px; background: #FAF8F5; border: 1px solid #E3E1DC; font-size: 13px; }
@media (max-width: 820px) {
  .cp__title { max-width: 100%; }
  .cp__arrows { display: none; }
  .cp__track { flex-direction: column; overflow: visible; gap: 48px; }
  .cp__card { flex: none; width: 100%; }
}