@charset "utf-8";
/* CSS Document*/

html {
  scroll-behavior: smooth;
}
a:hover {text-decoration: none;}

.error {color:red;}

*{font-family: 'Roboto', sans-serif;}
.taronja, a.taronja:hover {color: #FF5100;}
.blau, a.blau:hover {color:#005cb9;}
.pastilla {border: #ccc thin solid; border-radius: 25px; box-shadow: rgba(0, 0, 0, 0.6) 0px 7px 15px 0px; padding: 15px 10px; }
.extra {background-color: #e5eef8; padding-top: 40px; padding-bottom: 40px; }
.cielo {background-color: #f3f9fc;}


.padding-formulari {padding:20px 30px;}
.marge-formulari{padding-right:110px}
.fs-gigantic {font-size:54px !important; }
.fs-cita {font-size:40px !important; line-height:40px !important }
.fs-subtitol {font-size:22px !important; line-height:28px}
.fs-subtitol-responsive {font-size:20px !important; line-height:28px}
.fs-mini {font-size:12px}

/* BACKGROUNDS */
.seccion-cover{background-image:url(../images/posada-cover.jpg); background-size:cover; background-position:top top}
.seccion-que-inclou{background-image:url(../images/posada-005.jpg); background-size:cover; background-position:top top}
.faq-section {background-image:url(../images/posada-07.jpg); background-size:cover; background-position:center center}
.brand-logo {
    width: 65% !important; 
    height: auto; 
    display: block; 
    margin: 0 auto; 
    object-fit: contain;
}

.lrow {
    display: flex;
    align-items: center;
    justify-content: center;
    row-gap: 30px; 
}
.los_logos .col-md-2 {
    display: flex;
    align-items: center;
    justify-content: center;
}
.row-seven {
    display: grid;
    grid-template-columns: 1fr; 
	  grid-template-columns: repeat(7, 1fr);
    gap: 20px; 
    width: 100%;
    box-sizing: border-box;
}

.linkb:hover{font-weight:bolder}


.row-seven .custom-col {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
}

.row-seven img {
    width: 65% !important;
    max-height: 80px;
    height: auto;
    object-fit: contain;
}

header a {color:#222222}
header a:hover {color:#005cb9}
.logo {width:220px;}

.feature-icon{
    width:36px;
    height:36px;
    min-width:36px;
    border-radius:50%;
    background:#f15a24;
    display:flex;
    align-items:center;
    justify-content:center;
}

.feature-icon img{
    width:100%;
    display:block;

}




.seccion {
      position: relative;
      
      background-size: cover;
      background-position: center;
      display: flex;
      align-items: center;
      padding: 60px 80px;
    }

 .seccion::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, #FFFFFF 0%, #4B9BDD 100%);
      opacity: 0.65;
      z-index: 1;
    }

.revision-grid{
    display:grid;
    grid-template-columns: 0.6fr 1fr 1fr 1fr;
    gap:80px;
    align-items:start;
}

/* Texto */
.revision-content{
    grid-column:1 / 3;
    grid-row:1;
}

.revision-content h2{
    font-size:48px;
    line-height:1.1;
    margin-bottom:25px;
}

.revision-content p{
    margin-bottom:20px;
}

.btn-revisio{
    display:inline-block;
    margin-top:15px;
    padding:16px 35px;
    border-radius:40px;
    background:#ff5c10;
    color:#fff;
    text-decoration:none;
    font-weight:700;
}

.btn-revisio-white{
    display:inline-block;
    margin-top:15px;
    padding:16px 35px;
    border-radius:40px;
    background:transparent;
    color:#fff;
	border:2px solid #fff;
    text-decoration:none;
    font-weight:700;
}



/* Tarjetas */
.card-revisio{
 position: relative;
    background: #fff;
    border-radius: 20px;

    min-height: 160px;
    padding: 50px 30px 30px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    text-align: center;

    box-shadow: 0 8px 20px rgba(0,0,0,.12);
}

.card-revisio-mob-glob {background:#fff;
    border-radius:20px; padding:20px; display:none;}

.card-revisio.card-3{
    padding-left: 20px;
    padding-right: 20px;
}
.card-revisio-mob{
display:none;
    position:relative;
    background:#fff;
    padding:70px 40px 40px;

    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}


/* Icono */
.icono{
    position:absolute;
    width:80px;
    height:80px;
    border-radius:50%;
    background:#ff5c10;
    top:-40px;
    left:50%;
    transform:translateX(-50%);

    display:flex;
    align-items:center;
    justify-content:center;
}

.icono img{
    width:100%;
    height:auto;
    display:block;
}

.icono-mob{

  width:80px;
    height:80px;
    border-radius:50%;
    background:#ff5c10;

    display:flex;
    align-items:center;
    justify-content:center;

    margin:0 auto 15px;
}

.icono-mob img{
    width:85%;
    height:auto;
    display:block;
}

/* Primera fila */
.card-1{
    grid-column:3;
    grid-row:1;
   align-self: end;
}

.card-2{
    grid-column:4;
    grid-row:1;
    align-self: end;
}

/* Segunda fila */
.card-3{
    grid-column:2;
    grid-row:2;
	align-self: end;
}

.card-4{
    grid-column:3;
    grid-row:2;
	align-self: end;
}

.card-5{
    grid-column:4;
    grid-row:2;
	align-self: end;
}

.card-6{
    grid-column:3;
    grid-row:3;
	align-self: end;
}

.card-7{
    grid-column:4;
    grid-row:3;
	align-self: end;
}

/* Responsive */
@media (max-width: 991px){

    .revision-grid{
        grid-template-columns:1fr;
        gap:60px; width:100%
    }

    .revision-content,
    .card-1,
    .card-2,
    .card-3,
    .card-4,
    .card-5{
        grid-column:auto;
        grid-row:auto;
        margin-top:0;
    }

    .revision-content h2{
        font-size:36px;
    }
}

.titular_tranquilitat {width:550px;}
.rounded-pastilla {border-radius:30px;}
.bg-boto {background-color:#2062b5}
.f-section-cont {width:625px}
.logo-mobile {max-width:200px}
.p-18 {font-size:18px; }
.p-20 {font-size:20px; }
.p-22 {font-size:22px}
.p-26 {font-size:26px}
.p-button {padding-left:60px; padding-right:60px}
.fs-3rem {font-size:44px !important; line-height:44px !important}
.pt-sabies {padding-top:46px}
.section-superior {height:540px;}
.section-gracies{padding:150px 0px}
.section-gracies h1{font-size:64px}
.section-gracies h2{font-size:44px; font-weight:300}
.bg-gradiente { background: linear-gradient(to bottom, #acd5fa, #5a9ede); }
.bg-primary {background-color:#0060B5 !important;}
.border-transparent{border:2px solid transparent !important}
.bg-secondary {background-color:#ff5c10 !important;}
.absolute-relative {position:absolute;}
.logo-footer{width:298px}
.icon-circle {
    width: 90px; /* Tamańo del círculo */
    height: 90px;
    background-color: white; /* Fondo del círculo */
    border-radius: 50%; /* Hace que sea un círculo */
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); /* Sombra suave */
}

.icon-circle img {
    max-width: 55%; /* Ajusta el tamańo del icono */
    max-height: 55%;
}

.serveis-caixa-txt {width:240px}

#header {background: url("../images/fondo.jpg") no-repeat center; background-size: cover;}
#header h1 {font-weight: 700;font-size: 3rem; line-height: 1;}
#header	p {font-weight: 300; font-style: italic; font-size: 2rem; line-height: 1.2;}
#header #form_wrapper {
	color:#fff;background-color: #3f9ed7; padding: 15px 40px; border-radius: 20px;
	box-shadow: rgba(0, 0, 0, 0.6) 0px 7px 15px 0px;
	text-align: center;
}
#header #form_wrapper h2 { font-weight: 700;font-size: 2.3rem; line-height: 1;}
#header #form_wrapper > span {font-size: 1.2rem;}
#header #form_wrapper form {margin-top: 10px;}
#header #form_wrapper form input[type="checkbox"] { width:15px; height: 15px; float:left; margin-bottom: 120px; margin-right: 10px;}
#header #form_wrapper form input[type="text"],#header #form_wrapper form input[type="phone"] {border: 4px solid #005cb9; text-align: center; padding: 20px 10px; }
#header #form_wrapper form .form-group > span {font-size: 1rem; line-height: 1.3; display: block; text-align: left;}
#header #form_wrapper form .form-group > span a {color:#fff; font-weight: 700;}
#header #form_wrapper form input[type="submit"] {border: #fff 1px solid; border-radius: 30px; font-size: 1.5rem; color:#fff; padding:10px 20px; margin-top: 10px; }
#header #form_wrapper form input[type="submit"]:hover {background-color: #fff; color:#3f9ed7;}

.header-msg-bullets {z-index:10;position:absolute; right:65px; bottom:160px;}
.header-msg-bullets span {width:45px; height:32px; -webkit-border-radius: 4px;-moz-border-radius: 2px;border-radius: 2px; margin-top:2px; display: block;}
.header-msg-bullets span:nth-child(1) {background-color:#FF5100;}
.header-msg-bullets span:nth-child(2) {background-color:#FF5100; opacity: 0.7;}
.header-msg-bullets span:nth-child(3) {background-color:#FF5100; opacity: 0.5;}
.header-msg-bullets span:nth-child(4) {background-color:#005CB9; opacity: 0.5;}
.header-msg-bullets span:nth-child(5) {background-color:#005CB9; opacity: 0.7;}
.header-msg-bullets span:nth-child(6) {background-color:#005CB9;}

#header #header_jove .row {max-width: 1150px; margin: 0 auto;}
#header #header_jove {background-color:rgba(254, 80, 0, 0.6); margin-top: -130px; }
#header #header_jove p{font-size:1.5rem; color:#fff; font-style: normal; font-weight: 400; margin-top: 40px; text-align: right; }

#form-message-warning, #form-message-success {
  display: none;     background-color: white;
    padding: 10px 5px; margin-top: 10px;   }

#form-message-warning {
  color: red; }

#form-message-success {
  color: #28a745;
  font-size: 18px;
  font-weight: 500; }

.submitting {
  float: left;
  width: 100%;
  padding: 10px 0;
  display: none;
  font-size: 16px;
  font-weight: 500;
  color: #e3b04b; }

.list {text-align:center}
.list h3 {font-size:30px; line-height:36px; color:#FF5100;}
.list-icons {    display: flex;    flex-wrap: wrap;   justify-content: center; }
.list-icon {display:inline-block; width:22%; padding:10px 20px }
.list-icon p {color:#005CB9; font-size:16px; line-height:24px}



/* comentaris */
.reviews-section {
 
    padding: 80px 0;
}

.reviews-title {
    color: #fff;
    font-size: 3rem;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 50px;
}


.review-card {
    background: #fff;
    border: 3px solid rgba(255,255,255,.8);
    border-radius: 25px;
    padding: 22px;
    height: 100%;
    min-height: 330px;
}



.review-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.review-user {
    display: flex;
    align-items: center;
    gap: 12px;
}

.avatar {
    width: 42px;
    height: 42px;
	min-width: 42px;
    min-height: 42px;
    border-radius: 50%;
    background: #ff6200;
    color: #fff;
    font-weight: 700;
    font-size: 1.1rem;

    display: flex;
    align-items: center;
    justify-content: center;
}

.review-user span {
    color: #ff6200;
    font-size: 1.4rem;
    font-weight: 700;
}

.google-icon {
    width: 28px;
    height: 28px;
}

.stars {
    color: #ff6200;
    font-size: 1.2rem;
    letter-spacing: 2px;
    margin-bottom: 15px;
}

.review-card p {
    color: #222;
    line-height: 1.35;
    margin: 0;
}

/*	ACORDEÓN */


.faq-title {
    font-size: 3rem;
    font-weight: 700;
    color: #0f2235;
    margin-bottom: 30px;
}


.faq-accordion {
    max-width: 75%;
}

.faq-accordion .accordion-item {
    border: 0;
    background: transparent;
    margin-bottom: 14px;
}


.faq-accordion .accordion-button {

    background: #fff;
    color: #102234;

    border-radius: 40px !important;

    padding: 16px 22px;

    min-height: 52px;

    font-size: 1.15rem;
    font-weight: 700;

    box-shadow: none;
}

.faq-accordion .accordion-button:not(.collapsed) {

    background: #005eb8;
    color: #fff;

    border-radius: 22px 22px 0 0 !important;

    box-shadow: none;
}


.faq-accordion .accordion-button::after {

    background-image: none !important;

    content: '+';

    width: 30px;
    height: 30px;

    border-radius: 50%;

    background: #005eb8;
    color: #fff;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 22px;
    font-weight: 400;
    line-height: 1;

    margin-left: auto;

    transform: none;
}


.faq-accordion .accordion-button:not(.collapsed)::after {

   content: '\00D7'; 

    background: #fff;
    color: #005eb8;

    transform: none;
}


.faq-accordion .accordion-body {

    background: #005eb8;
    color: #fff;

    padding: 0 22px 22px;

    font-size: 1.1rem;
    line-height: 1.5;

    border-radius: 0 0 22px 22px;
}


.faq-accordion .accordion-button:focus {
    box-shadow: none;
}

.faq-accordion .accordion-collapse {
    border: 0;
}


@media (max-width: 768px) {

    .faq-title {
        font-size: 2rem;
    }

    .faq-accordion .accordion-button {
        font-size: 1rem;
    }

    .faq-accordion .accordion-body {
        font-size: 1rem;
    }

}


/* PAGINACIÓN */

.swiper-pagination {
    position: relative;
    margin-top: 35px;
}

.swiper-pagination-bullet {
    width: 14px !important;
    height: 14px !important;
    background: transparent !important;
    border: 2px solid #fff !important;
    opacity: 1;
}

.swiper-pagination-bullet-active {
    background: #fff !important;
}



@media only screen and (max-width: 1400px){
.section-gracies h1{font-size:48px}
.section-gracies h2{font-size:21px; font-weight:300}
.card-revisio{
    padding: 40px 20px 10px;min-height: 175px;
	}
	.revision-grid{gap:60px}
	.fs-subtitol-responsive{font-size:18px !important; line-height:24px !important}
	.review-card {

    min-height: 410px;
	
}
.f-section-cont {width:100%}
.seccion-cover-d{padding-top:380px !important}
}
@media only screen and (max-width: 1300px){
.brand-logo {width: 80% !important; }
.row-seven img {    width: 80% !important;}

}

@media only screen and (max-width: 1200px){
.brand-logo {width: 90% !important; }
.row-seven img {    width: 90% !important;}

.card-revisio{padding: 50px 30px 30px;}
}

@media only screen and (max-width: 960px){
.seccion-cover{background-image:url(../images/familia-mob.jpg); background-size:cover; background-position:center center; padding-bottom:280px !important;}
.seccion-que-inclou{background-image:url(../images/posada-005-mob.jpg); background-size:cover; background-position:top center}
.faq-section {background-image:url(../images/posada-07-mob.jpg); background-size:cover; background-position:center center}

.padding-formulari {padding:20px 20px;}
.marge-formulari{padding-right:0px}
.brand-logo {width:70% !important; }
.row-seven img {    width: 70% !important;}
.section-superior {height:auto}

.serveis-caixa-txt{width:100%}
.boto-formulari {font-size:15px !important; width:100%}
.fs-gigantic {font-size:24px !important; line-height:24px !important}
.fs-cita {font-size:24px !important; line-height:24px !important}
.fs-1 {font-size:24px !important; line-height:24px !important}
p {font-size:14px !important; line-height:18px !important}

    .revision-grid { gap: 40px;}

/* BACKGROUNDS */


.fs-subtitol {font-size:14px !important; line-height:18px !important}
.fs-3rem {font-size:24px !important; line-height:24px !important}
.fs-4 {font-size:14px !important; line-height:18px !important}
.form-check{font-size:14px !important; line-height:18px !important}
.rounded-pastilla button {font-size:14px !important; }
.fs-peu{font-size:16px !important}
.logo-footer{width:90%; height:auto}
.absolute-relative {position:relative;}
.pt-sabies{padding:0px}
.fs-3rem{font-size:2rem}
.p-20{font-size:16px}
.p-button{padding:0px}
.section-gracies{padding:0px 0px}
.section-gracies h1{font-size:34px}
.section-gracies h2{font-size:20px; font-weight:300}
.row-seven {
        grid-template-columns: repeat(2, 1fr);
        justify-content: center;
    }

.card-revisio{display:none}
.card-revisio-mob {display:block}
.card-revisio-mob-glob{display:block; padding:40px 20px}

.faq-accordion {
    max-width: 100%;
}
.seccion {
      padding: 40px 80px;
    }

}

@media only screen and (max-width: 768px){
	.header-msg-bullets {display: none;}
	#header #header_jove { margin-top: -10px; }
	#header #header_jove, #header #header_jove p {text-align: center!important; }
	#header #header_jove p {margin-top: 20px!important; }
	#header #form_wrapper {margin-top: 50px; }
	.list h3 {font-size:21px; line-height:28px}
	.list-icons {padding:20px 0px;}
	.list-icon {width:50%;}
	.p25 {padding-left: 25px; padding-right: 25px;}
	.review-card {
    min-height: 300px;
}

}

.claim-1 { font-size: 1.4rem;  line-height: 1.2;}
.super-claim { font-weight: 700; font-size: 1.8rem; line-height: 1.2; display: block;  }
.medium-claim { font-weight: 700; font-size: 1.2rem; }

@media only screen and (max-width: 768px){
	.botones div { text-align: center!important;}
}


.extra .row {max-width: 1050px; margin: 0 auto;}

.logos {padding:80px 0px 60px 0px; }
.marginauto {max-width:1150px; margin:0 auto;}
.logospie{text-align:center}.logospie span{vertical-align:middle;display:inline-block;padding:10px}
.logospie span img{height:37px}

@media only screen and (max-width: 580px){

.titular_tranquilitat {width:100%;}
.brand-logo {width:100% !important; }
.row-seven img {    width: 100% !important;}
.oragne-mobile span {font-size:15px;}
.logospie span {width:33.333%; margin: 5px;}
.logospie span img{width:100%; height:auto;}
}

footer {
	background-color: #FF5100; color:#fff;
}
footer p {margin-top: 20px;}
footer a {color:#fff;}
footer a:hover {color:#fff; text-decoration: none;}