html,body,* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
body {
  font-family: var(--text-regular);
}
:root {
  /* Colores */
  --first: #611232;
  --titles: #595959;
  --second: #be955b;
  --third: #575756;
  --four: #ba5462;
  --five: #255b4d;
  --background: #f2eada;
  --backitem: #3c9987;
  --backcarousel: #008168;
  --backbtn: #dfc8aa;
  --backmod: #333333;
  --owl: #ff6700;
  --backowl: #132436;
  --card: #fefdfc;
  --cardtext: #939393;
  --satlogo: #4a89c8;
  --tab: #f2f4f4;
  --black: #000;
  --white: #fff;
  /*Colores agregados */
  --active: #cba97b;
  --inactive: #85bfb4;
  --inactive2: #d9949a;
  --gold: #bc955c;
  --darktext: #f2e8dc;
  --backgroundlight: #e6d3bb;
  --backgroundblack: #333333;
  --backgroundgray: #4d4d4d;
  --graylight: #666666;
  /*Cielo*/
  --first-cloud: #f3f9f8;
  --second-cloud: #84c0b4;
  --third-cloud: #b6d9d2;
  --four-cloud: #53a596;

  /* Texto */
  --title: NotoSans-Bold, sans-serif;
  --text-regular: NotoSans-Regular, sans-serif;
  --text-black: NotoSans-Black, sans-serif;
  --text-bold: NotoSans-Bold, sans-serif;
  --texto-extra-bold: NotoSans-ExtraBold, sans-serif;
  --text-book: NotoSans-Thin, sans-serif;
  --text-extra-light: NotoSans-ExtraLight, sans-serif;
  --text-light: NotoSans-Light, sans-serif;
  --text-medium: NotoSans-Medium, sans-serif;
  --text-italic: NotoSans-Regular-Italic, sans-serif;
  --text-bold-italic: NotoSans-BoldItalic, sans-serif;
  --text-thin: NotoSans-Thin, sans-serif;
  --text-medium: NotoSans-Medium, sans-serif;
}
@media (hover: none) {
  button:focus {
    outline: none;
  }
}
@media (max-width: 600px) {
  .portal-container {
    width: 90vw;
  }
}
@media (min-width: 1500px) {
  .portal-container {
    width: 60vw;
    max-width: 1500px;
  }
}
p {
  margin: 0;
  padding: 0;
}

.container-fluid {
    display: grid;
    /*grid-template-columns: repeat(5, 190px);*/
    /*justify-content: center;*/
    gap: 15px
}

@media (max-width: 1200px) {
    .row-procedures.svelte-drxaec {
        grid-template-columns: repeat(4, 190px)
    }
}

@media (max-width: 768px) {
    .row-procedures.svelte-drxaec {
        grid-template-columns: repeat(3, 190px)
    }
}

@media (max-width: 576px) {
    .row-procedures.svelte-drxaec {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px
    }
}
.card-custom {
    display:flex;
    height: fit-content;
    width:190px;
    flex-wrap:wrap;
    flex-direction: column;
    align-items: center;
    box-shadow:0 0 10px -3px #0006;
    border-radius:20px;
    overflow: hidden; /* 🔑 esto hace que los hijos respeten el borde redondeado */
}

.link-procedures {
    width: 100%;
    height: 100%;
    text-decoration: none
}

.card-main {
    height: 82%;
    width: 100%;
    padding: 10% 10% 0
}

.card-image {
    height: 50%;
    padding-bottom: 10px
}

.card-icon,i {
    max-height: 100%
}

.card-title {
    height: 50%;
    padding: 5px 0
}

.title-procedure {
    margin: 0;
    font-size: 18px;
    font-family: var(--text-bold);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    /*-webkit-line-clamp: 3;*/
    max-height: calc(1.2em * 3)
}

.card-footer {
    display: flex;
    height: 18%;
    width: 100%;
    justify-content: right;
}

.footer-image {
    height: 100%;
    width: 25%;
    padding: 4px
}

.footer-arrow {
    max-height: 100%;
    transition: transform .5s
}

.card-custom:hover .card-footer {
    background-color: var(--card-footer-background);
    transition: background-color .3s
}

@media (width < 992px) {
    .card-custom {
        width: min(100%, 190px)
    }
}

@media (width < 465px) {
    .title-procedure {
        font-size: 14px
    }
}