.rtw-portal{max-width:1100px;margin:0 auto;padding:18px 0}
.rtw-portal-header{margin-bottom:18px}
.rtw-masonry{columns:3 260px;column-gap:18px}
.rtw-card{break-inside:avoid;display:block;margin:0 0 18px;border:1px solid #eee;border-radius:16px;overflow:hidden;text-decoration:none;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.rtw-thumb img{width:100%;height:auto;display:block}
.rtw-thumb-empty{display:flex;align-items:center;justify-content:center;min-height:160px;background:linear-gradient(135deg,rgba(0,0,0,.05),rgba(0,0,0,.02))}
.rtw-thumb-empty span{opacity:.7;font-size:14px}
.rtw-card-title{padding:12px 14px;font-weight:600;color:#111}
.rtw-obra-hero img{width:100%;height:auto;border-radius:16px;display:block}
.rtw-obra-meta{display:grid;gap:6px;margin:14px 0 6px}
.rtw-interv-list{list-style:none;padding:0;margin:10px 0;display:grid;gap:10px; color:#333;}
.rtw-interv-list li{display:flex;gap:10px;align-items:center;justify-content:space-between;border:3px solid #333;border-radius:21px;padding:10px 12px;background:rgba(255,255,255,0.4); color:#333!important;}
.rtw-interv-list a{color:#333;}
.rtw-badge{font-size:12px;padding:4px 10px;border-radius:999px;border:1px solid #ddd;opacity:.85;white-space:nowrap}
.rtw-section{margin:18px 0}
.rtw-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.rtw-grid img{width:100%;height:auto;border-radius:12px;display:block}
.rtw-docs{display:grid;gap:8px}
.rtw-docs a{display:flex;color:#333;gap:10px;align-items:center;padding:10px 12px;border:2px solid #333;border-radius:21px;text-decoration:none;background:rgba(255,255,255,0.4);}

@media(max-width:900px){.rtw-masonry{columns:2 220px}.rtw-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.rtw-masonry{columns:1}.rtw-grid{grid-template-columns:1fr}}

/* --- UX refinements --- */
.rtw-card-cta{padding:0 14px 14px;font-size:14px;opacity:.72}
.rtw-card:hover .rtw-card-cta{opacity:1}
.rtw-sep{border:0;height:1px;background:rgba(0,0,0,.15);margin:24px 0}
.rtw-back{margin:0 0 22px}
.rtw-back a{font-size:18px;text-decoration:none}

/* Fotos grid (multi) */
.rtw-photo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:10px}
.rtw-photo-grid img{width:100%;height:auto;border-radius:12px;display:block}
@media(max-width:900px){.rtw-photo-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.rtw-photo-grid{grid-template-columns:1fr}}

/* Login visual */
.rtw-login form{background:transparent;border:3px solid rgba(0,0,0,.25);border-radius:99px;padding:24px;max-width:520px;margin:0 auto}
@media(max-width:520px){.rtw-login form{border-width:2px;padding:18px}}
.rtw-login label,.rtw-login input,.rtw-login button,.rtw-login input[type="submit"]{font-family:"Playfair Display",serif}
.rtw-login input{border-radius:99px}
.rtw-login input[type="submit"]{border-radius:99px;border:3px solid rgba(0,0,0,.25);background:transparent;padding:10px 18px}
@media(max-width:520px){.rtw-login input[type="submit"]{border-width:2px}}

/* Status colors */
.rtw-badge{border:2px solid rgba(0,0,0,.18)}
.rtw-badge-rebut{background:rgba(0,0,0,.06)}
.rtw-badge-diagnosi{background:rgba(120,80,255,.12)}
.rtw-badge-en_proces{background:rgba(255,180,0,.18)}
.rtw-badge-en_espera{background:rgba(0,150,255,.12)}
.rtw-badge-finalitzat{background:rgba(0,200,120,.14)}
.rtw-badge-entregat{background:rgba(0,200,120,.22)}

/* Header portal */
.rtw-portal-header{ margin-bottom:32px; }
.rtw-portal-intro{ max-width:720px; opacity:.85;margin:0 auto; }
.rtw-portal-legend{
  list-style:none;
  padding:0;
  margin:16px 0 0;
  display:flex;
  gap:18px;
  flex-wrap:wrap;
}
.rtw-portal-legend li{ font-size:14px; }

/* Separadors */
.rtw-sep{ border:0; height:1px; background:rgba(0,0,0,.15); margin:24px 0; }
.rtw-sep--end{ margin:32px 0 16px; }

/* CTA card */
.rtw-card-cta{ padding:0 14px 14px; font-size:14px; opacity:.7; }
.rtw-card:hover .rtw-card-cta{ opacity:1; }

/* Botó tornar */
.rtw-back{ margin-bottom:24px; }
.rtw-back a{ font-size:18px; }

/* Badges estat */
.rtw-badge{ padding:6px 12px; border-radius:999px; font-size:12px; border:2px solid rgba(0,0,0,.2); }
.rtw-badge-rebut{ background:#eee; }
.rtw-badge-diagnosi{ background:#e0d9ff; }
.rtw-badge-en_proces{ background:#ffe3a3; }
.rtw-badge-finalitzat{ background:#c9f1d9; }

/* Login */
.rtw-login form{
  background:transparent;
  border:3px solid rgba(0,0,0,.25);
  border-radius:99px;
  padding:24px;
  max-width:520px;
}
@media(max-width:600px){
  .rtw-login form{ border-width:2px; }
}
.rtw-login label,
.rtw-login input,
.rtw-login button{
  font-family:"Playfair Display", serif;
}
.rtw-alert{
  border:2px solid rgba(200,0,0,.3);
  padding:12px 14px;
  border-radius:14px;
  margin: 0 0 14px;
}
/* ===== Carrusel fotos (inline) ===== */
.rtw-portal .rtw-carousel{ margin: 18px 0 26px; }

.rtw-portal .rtw-carousel__wrap{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:10px !important;
}

.rtw-portal .rtw-carousel__btn{
  border:2px solid rgba(0,0,0,.18);
  background:transparent;
  border-radius:999px;
  width:40px;
  height:40px;
  font-size:24px;
  line-height:36px;
  cursor:pointer;
  flex:0 0 auto;
}

.rtw-portal .rtw-carousel__btn:disabled{
  opacity:.35;
  cursor:default;
}

.rtw-portal .rtw-carousel__viewport{
  overflow:hidden !important;
  flex:1 1 auto !important;
  width:100% !important;
  scroll-behavior:smooth;
}

.rtw-portal .rtw-carousel__track{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  gap:10px !important;
  width:100% !important;
}

/* Mobile: 1 foto visible */
.rtw-portal .rtw-carousel__item{
  flex:0 0 100% !important;
  max-width:100% !important;
}

.rtw-portal .rtw-carousel__item img{
  display:block !important;
  border-radius:14px !important; /* arregla el 0 en móvil */
}

/* Desktop: 3 fotos visibles */
@media (min-width: 900px){
  .rtw-portal .rtw-carousel__item{
    flex:0 0 calc((100% - 20px) / 3) !important;
    max-width: calc((100% - 20px) / 3) !important;
  }
}
/* ===== Carousel hard-fix for mobile (Divi overrides) ===== */
@media (max-width: 899px){
  /* Evita columnes/masonry heretades */
  .rtw-portal .rtw-carousel{ column-count: initial !important; column-gap: initial !important; }

  .rtw-portal .rtw-carousel__wrap{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
  }
  .rtw-portal .rtw-carousel__viewport{
    overflow:hidden !important;
  }
  .rtw-portal .rtw-carousel__track{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
  }
  .rtw-portal .rtw-carousel__item{
    flex:0 0 100% !important;
    max-width:100% !important;
  }
  .rtw-portal .rtw-carousel__item img{
    border-radius:14px !important;
  }
  .rtw-portal .rtw-carousel__btn{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
  }
}
/* === Carrusel: totes les imatges amb el mateix ratio (ROBUST) === */
/* Fem servir un "ratio box" amb pseudo-element per evitar que cap CSS extern anul·li l'alçada */

.rtw-portal .rtw-carousel__item{
  position: relative !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  background: rgba(0,0,0,.04) !important;
}

/* 5/4 => 80% (alçada respecte amplada). Canvia a 100% per 1/1 */
.rtw-portal .rtw-carousel__item::before{
  content: "";
  display: block;
  padding-top: 80%;
}

/* Si hi ha un <a> envoltant la imatge, l'estirem a tot el contenidor */
.rtw-portal .rtw-carousel__item > a{
  position: absolute;
  inset: 0;
  display: block;
}

/* Imatge: absoluta, omple i retalla */
.rtw-portal .rtw-carousel__item img{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 0 !important; /* el radi el té el contenidor */
}

/* Botons (fletxes) "premium" */
.rtw-portal .rtw-carousel__btn{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 42px !important;
  height: 42px !important;
  border: 1px solid rgba(0,0,0,.18) !important;
  background: rgba(255,255,255,.85) !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.08) !important;
  border-radius: 999px !important;
}

.rtw-portal .rtw-carousel__btn svg{ display:block !important; }






/* ===== LOGIN WP (wrapper: .rtw-portal.rtw-login) ===== */

.rtw-portal.rtw-login form#loginform{
  background: transparent !important;
  border: 0 !important;            /* quita el borde exterior */
  border-radius: 0 !important;
  padding: 0 !important;
  max-width: 560px;
  margin: 0 auto;

  display: flex !important;         /* todo en columna */
  flex-direction: column !important;
  gap: 14px !important;
}

.rtw-portal.rtw-login form#loginform p{
  margin: 0 !important;            /* WP mete márgenes en <p> */
}

.rtw-portal.rtw-login p.login-username,
.rtw-portal.rtw-login p.login-password{
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.rtw-portal.rtw-login label{
  display: block !important;
  font-size: 24px !important;
  line-height: 1.2 !important;
}

.rtw-portal.rtw-login input#user_login,
.rtw-portal.rtw-login input#user_pass{
  width: 100% !important;
  max-width: 100% !important;

  padding: 14px 16px !important;
  font-size: 24x !important;

  border: 0px solid #000 !important;     /* borde negro */
  border-radius: 21px !important;
  background: rgba(255,255,255,.65) !important;
  outline: none !important;
  box-shadow: none !important;
}

.rtw-portal.rtw-login input#user_login:focus,
.rtw-portal.rtw-login input#user_pass:focus{
  background: rgba(255,255,255,.85) !important;
}

/* “Recuérdame” alineado en una línea */
.rtw-portal.rtw-login p.login-remember label{
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-size: 24px !important;
}

.rtw-portal.rtw-login input#rememberme{
  width: 18px !important;
  height: 18px !important;
}

/* Botón: borde negro + hover con sombra como “Veure serveis” */
.rtw-portal.rtw-login p.login-submit{
  display: flex !important;
  justify-content: center !important;
  margin-top: 6px !important;
}

.rtw-portal.rtw-login input#wp-submit{
  padding: 12px 22px !important;
  font-size: 18px !important;       /* tipografía más grande */
  font-weight: 600 !important;

  border: 2px solid #000 !important; /* borde negro */
  border-radius: 999px !important;

  background: transparent !important;
  cursor: pointer;

  box-shadow: 0px 0px 0 rgba(0,0,0,.35) !important;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease !important;
}

.rtw-portal.rtw-login input#wp-submit:hover{
  transform: translate(2px, 2px) !important;
  box-shadow: 6px 6px 0 rgba(0,0,0,.35) !important;
  background: rgba(0,0,0,.03) !important;
}
/* ===== Notificacions (compacte, sota les obres) ===== */
.rtw-notify--compact{
  max-width: 520px;
  margin: 18px auto 0;
  padding: 10px 14px;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 16px;
  background: rgba(255,255,255,.55);
  backdrop-filter: blur(4px);
}

.rtw-notify--compact .rtw-notify-form{
  display: grid;
  gap: 10px;
  margin: 0;
}

.rtw-notify--compact .rtw-check{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  line-height: 1.35;
}

.rtw-notify--compact input[type="checkbox"]{
  margin-top: 2px;
  transform: scale(.95);
  accent-color: #caa24f; /* dorado suave coherente */
}

.rtw-notify--compact strong{ font-weight: 700; }

.rtw-notify-saved{
  font-size: 12px;
  opacity: .75;
  justify-self: end;
  padding-top: 4px;
}

/* Mobile */
@media (max-width:520px){
  .rtw-notify--compact{
    max-width: 92%;
    padding: 10px 12px;
  }
  .rtw-notify--compact .rtw-check{
    font-size: 13px;
  }
}
.rtw-small{
margin-top:20px;}


/* Form del forgot: mismo layout que el login (sin borde, en columna) */
.rtw-portal.rtw-login form.rtw-forgot{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  max-width: 560px !important;
  margin: 0 auto !important;

  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

/* Quitar márgenes típicos de <p> en WP */
.rtw-portal.rtw-login form.rtw-forgot p{
  margin: 0 !important;
}

/* Label igual que login */
.rtw-portal.rtw-login form.rtw-forgot label{
  display: block !important;
  font-size: 24px !important;
  line-height: 1.2 !important;
  font-family: "Playfair Display", serif !important;
}

/* Input del forgot: igual que user/pass del login */
.rtw-portal.rtw-login form.rtw-forgot input#rtw_user_login{
  width: 100% !important;
  max-width: 100% !important;

  padding: 14px 16px !important;
  font-size: 24px !important; /* ojo: en tu CSS tenías "24x" (typo) */
  font-family: "Playfair Display", serif !important;

  border: 0 !important;
  border-radius: 21px !important;
  background: rgba(255,255,255,.65) !important;

  outline: none !important;
  box-shadow: none !important;
}

.rtw-portal.rtw-login form.rtw-forgot input#rtw_user_login:focus{
  background: rgba(255,255,255,.85) !important;
}

/* Botón del forgot: MISMO estilo que tu #wp-submit */
.rtw-portal.rtw-login form.rtw-forgot button[type="submit"]{
  padding: 12px 22px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  font-family: "Playfair Display", serif !important;

  border: 2px solid #000 !important;
  border-radius: 999px !important;

  background: transparent !important;
  cursor: pointer;

  box-shadow: 0px 0px 0 rgba(0,0,0,.35) !important;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease !important;
}

.rtw-portal.rtw-login form.rtw-forgot button[type="submit"]:hover{
  transform: translate(2px, 2px) !important;
  box-shadow: 6px 6px 0 rgba(0,0,0,.35) !important;
  background: rgba(0,0,0,.03) !important;
}

/* Centrar el botón como en login-submit (opcional) */
.rtw-portal.rtw-login form.rtw-forgot p:has(button[type="submit"]){
  display: flex !important;
  justify-content: center !important;
  margin-top: 6px !important;
}
.rtw_user_login{
margin-bottom:20px;
}
.rtw-portal.rtw-login form.rtw-forgot label{
margin-bottom:20px;
}
.rtw-obra-hero img {
    max-width: 500px;
    margin: 0 auto;
}