

/* ===== IB ABOGADOS · BOUTIQUE LEGAL ===== */
.boutique-hero,.practice-hero{
  min-height:650px;display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(28px,6vw,90px);
  align-items:center;padding:76px clamp(22px,6vw,96px);
  background:radial-gradient(circle at 82% 18%,rgba(245,154,35,.14),transparent 30%),linear-gradient(180deg,#fff,#f8fafb)
}
.boutique-hero-copy,.practice-hero>div{max-width:850px}
.boutique-manifesto,.practice-side{
  background:#182838;color:#fff;border-radius:28px;padding:38px;box-shadow:0 22px 70px rgba(24,40,56,.18)
}
.boutique-manifesto h2{color:#fff;font-size:clamp(34px,4vw,52px);margin-bottom:20px}
.boutique-manifesto p{color:#cbd7df}.manifesto-rule{height:1px;background:rgba(255,255,255,.18);margin:28px 0}
.boutique-areas{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.area-card{position:relative;padding:34px;border:1px solid #dfe5ea;border-radius:26px;background:#fff;min-height:430px;display:flex;flex-direction:column;box-shadow:0 14px 45px rgba(24,40,56,.055);overflow:hidden}
.area-card:before{content:"";position:absolute;left:0;top:0;right:0;height:5px;background:#f59a23}
.area-number{font-size:12px;font-weight:900;color:#fff;background:#182838;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.area-kicker{font-size:11px;font-weight:900;letter-spacing:.12em;color:#f59a23;margin-bottom:12px}
.area-card h3{font-size:25px;line-height:1.18}.area-card ul{padding-left:20px;color:#65717c}.area-card li{margin-bottom:9px}
.area-link{margin-top:auto;color:#182838;font-weight:900;padding-top:20px;border-top:1px solid #e4e9ed}
.area-link:hover{color:#f59a23}
.boutique-method{margin:0 clamp(22px,6vw,96px) 90px;background:#182838;color:#fff;border-radius:30px;padding:42px;display:grid;grid-template-columns:1fr 1.2fr;gap:40px;align-items:center}
.boutique-method h2{color:#fff}.method-steps{display:grid;gap:12px}
.method-steps>div{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:center;padding:15px;border:1px solid rgba(255,255,255,.12);border-radius:15px}
.method-steps b{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#f59a23}
.general-lead-form{max-width:900px;background:#fff;border:1px solid #dfe5ea;border-radius:24px;padding:28px;box-shadow:0 14px 44px rgba(24,40,56,.06)}
.lead.compact{max-width:760px}
.practice-side{text-align:center}
.practice-side p{color:#cbd7df}.practice-side b{letter-spacing:.15em}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.service-card{border:1px solid #dfe5ea;border-radius:24px;padding:30px;background:#fff}
.service-card span{display:inline-flex;width:36px;height:36px;border-radius:10px;align-items:center;justify-content:center;background:#f59a23;color:#fff;font-weight:900;margin-bottom:18px}
.service-card p{color:#65717c}
@media(max-width:980px){
  .boutique-hero,.practice-hero{grid-template-columns:1fr;min-height:auto}
  .boutique-areas,.service-grid{grid-template-columns:1fr}
  .boutique-method{grid-template-columns:1fr}
}
@media(max-width:620px){
  .boutique-hero,.practice-hero{padding:48px 18px}
  .boutique-manifesto,.practice-side{padding:26px}
  .area-card{min-height:auto;padding:26px}
  .boutique-method{margin:0 14px 64px;padding:26px}
  .general-lead-form{padding:20px}
}

/* ===== Recursos descargables ===== */
.download-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.download-card{border:1px solid var(--line);border-radius:22px;background:#fff;padding:24px;display:flex;flex-direction:column;gap:16px;box-shadow:0 12px 40px rgba(24,40,56,.055)}
.download-card h3{font-size:22px;margin-bottom:8px}.download-card p{color:var(--muted);font-size:14px}
.download-card .btn{margin-top:auto}.download-icon{width:46px;height:46px;border-radius:12px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:900}
.resource-home-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.resource-home-grid a{display:grid;gap:8px;padding:24px;border:1px solid var(--line);border-radius:20px;background:#fff}.resource-home-grid a:hover{border-color:var(--orange);transform:translateY(-2px)}
.resource-home-grid b{color:var(--navy);font-size:20px}.resource-home-grid span{color:var(--muted)}
#resourceDialog{width:min(930px,94vw);max-height:92dvh;border:0;border-radius:26px;padding:0;overflow:hidden;box-shadow:0 30px 100px rgba(11,25,37,.35)}
#resourceDialog::backdrop{background:rgba(8,18,27,.72);backdrop-filter:blur(5px)}
.resource-dialog-inner{display:grid;grid-template-columns:.72fr 1.28fr;max-height:92dvh}
.resource-intro{background:var(--navy);color:#dbe5ec;padding:38px}.resource-intro h2{color:#fff}.resource-intro p{color:#cbd7df}
#resourceForm{padding:30px;background:#fff;overflow-y:auto}.resource-close{position:absolute;right:14px;top:12px;width:38px;height:38px;border:0;border-radius:50%;font-size:25px;z-index:5;cursor:pointer}
@media(max-width:980px){.download-grid,.resource-home-grid{grid-template-columns:1fr}.resource-dialog-inner{grid-template-columns:1fr}.resource-intro{display:none}}
@media(max-width:620px){
 #resourceDialog{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;border-radius:0;margin:0}
 #resourceDialog[open]{display:block}
 .resource-dialog-inner{display:block;height:100dvh;max-height:none;overflow-y:auto;-webkit-overflow-scrolling:touch}
 #resourceForm{min-height:calc(100dvh + 1px);padding:58px 17px calc(28px + env(safe-area-inset-bottom));overflow:visible}
 .resource-close{position:fixed;top:calc(10px + env(safe-area-inset-top));right:12px}
 #resourceForm .field-row{display:block}
 #resourceForm input,#resourceForm select,#resourceForm textarea{font-size:16px;min-height:45px}
 #resourceForm .btn.full{position:static;margin-top:14px}
}


/* ===== Integración visual de guías e infografías ===== */
.resource-preview-pair{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:-4px -4px 2px;
  padding:6px;
  border-radius:17px;
  background:linear-gradient(145deg,#112638,#203b50);
}
.resource-preview-pair img{
  width:100%;
  height:210px;
  object-fit:cover;
  object-position:top;
  border-radius:11px;
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}
.download-card{
  overflow:hidden;
}
.download-card .download-icon{
  display:none;
}
.download-card .area-kicker{
  margin-top:2px;
}
.visual-library{
  background:linear-gradient(180deg,#f8fafb,#fff);
}
.visual-library-frame{
  max-width:1280px;
  margin:0 auto 26px;
  padding:10px;
  border-radius:26px;
  background:#10293c;
  box-shadow:0 24px 70px rgba(24,40,56,.16);
}
.visual-library-frame img{
  display:block;
  width:100%;
  height:auto;
  border-radius:18px;
}
@media(max-width:980px){
  .resource-preview-pair img{height:280px}
}
@media(max-width:620px){
  .resource-preview-pair img{height:205px}
  .resource-preview-pair{gap:6px}
  .visual-library-frame{margin-left:-6px;margin-right:-6px;padding:6px;border-radius:18px}
}

/* ===== Corrección logo responsive ===== */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:24px}
.topbar .brand{display:flex;align-items:center;flex:0 0 auto;width:auto;max-width:190px}
.topbar .brand img{
  display:block;
  width:auto !important;
  height:58px !important;
  max-width:190px !important;
  max-height:58px !important;
  object-fit:contain;
}
footer img{
  width:auto !important;
  height:54px !important;
  max-width:180px !important;
  object-fit:contain;
}
@media(max-width:620px){
  .topbar .brand{max-width:170px}
  .topbar .brand img{height:54px !important;max-width:170px !important;max-height:54px !important}
  footer img{height:50px !important;max-width:165px !important}
}


/* =========================================================
   CORRECCIÓN GLOBAL MÓVIL · SIN DESPLAZAMIENTO HORIZONTAL
   ========================================================= */

html, body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

*, *::before, *::after {
  box-sizing: border-box;
  min-width: 0;
}

img, svg, video, canvas, iframe {
  max-width: 100%;
  height: auto;
}

main, section, header, footer, nav, form, article, aside, div {
  max-width: 100%;
}

/* Evita desbordamientos provocados por textos largos, emails o URLs */
p, li, a, span, strong, b, h1, h2, h3, h4, label, summary {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

/* Mantiene importes unidos sin ensanchar el viewport */
.metric strong,
.metric-grid strong,
.hero-card strong,
.nowrap-money {
  white-space: nowrap !important;
  max-width: 100%;
}

/* Los elementos grid/flex pueden encogerse correctamente */
.hero > *,
.boutique-hero > *,
.practice-hero > *,
.problem-strip > *,
.cards > *,
.split > *,
.timeline > *,
.boutique-areas > *,
.service-grid > *,
.download-grid > *,
.resource-home-grid > *,
.field-row > *,
.dialog-grid > *,
.resource-dialog-inner > * {
  min-width: 0;
}

/* Navegación y cabecera */
.topbar {
  width: 100%;
  max-width: 100%;
}

.topbar .brand {
  min-width: 0;
  flex-shrink: 0;
}

.nav {
  min-width: 0;
  max-width: 100%;
}

/* Formularios */
input,
select,
textarea,
button {
  max-width: 100%;
}

input,
select,
textarea {
  min-width: 0;
}

/* Tarjetas y bloques visuales */
.card,
.area-card,
.solution,
.step,
.download-card,
.service-card,
.general-lead-form,
.hero-card,
.boutique-manifesto,
.practice-side,
.visual-library-frame,
.leadmagnet,
.final-cta,
.boutique-method {
  width: 100%;
  max-width: 100%;
}

/* Corrige elementos que usaban viewport width y podían sumar scrollbar */
dialog#guideDialog,
#resourceDialog {
  max-width: calc(100% - 16px);
}

@media (max-width: 620px) {
  body {
    position: relative;
    width: 100%;
    overflow-x: hidden;
  }

  .topbar {
    padding-left: 14px;
    padding-right: 14px;
    gap: 10px;
  }

  .topbar .brand {
    max-width: 150px;
  }

  .topbar .brand img {
    max-width: 150px !important;
    width: auto !important;
    height: 50px !important;
  }

  .nav {
    flex: 0 1 auto;
    gap: 8px;
  }

  .nav .btn,
  .nav button {
    white-space: nowrap;
    padding: 9px 11px;
    font-size: 12px;
  }

  .hero,
  .boutique-hero,
  .practice-hero,
  .section {
    width: 100%;
    max-width: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }

  .leadmagnet,
  .final-cta,
  .boutique-method {
    width: auto;
    max-width: calc(100% - 28px);
    margin-left: 14px;
    margin-right: 14px;
  }

  .problem-strip,
  .three,
  .split,
  .check-grid,
  .timeline,
  .field-row,
  .boutique-areas,
  .service-grid,
  .download-grid,
  .resource-home-grid,
  footer {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  /* No usar 100vw dentro de la página: puede provocar scroll lateral */
  dialog#guideDialog,
  #resourceDialog {
    inset: 0;
    width: 100%;
    max-width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    margin: 0;
    border-radius: 0;
  }

  dialog#guideDialog .dialog-grid,
  #resourceDialog .resource-dialog-inner {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  dialog#guideDialog .dialog-grid form,
  #resourceDialog form {
    width: 100%;
    max-width: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }

  .resource-preview-pair {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    width: 100%;
    max-width: 100%;
  }

  .resource-preview-pair img {
    width: 100%;
    max-width: 100%;
    object-fit: cover;
  }

  .metric-grid {
    grid-template-columns: minmax(0,1fr) !important;
  }

  .metric-grid strong {
    font-size: clamp(22px, 7vw, 28px);
  }

  h1 {
    font-size: clamp(34px, 10vw, 48px);
  }

  h2 {
    font-size: clamp(28px, 8vw, 38px);
  }

  /* Evita que cualquier contenido decorativo salga del ancho */
  .visual-library-frame {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
  }

  footer {
    width: 100%;
    padding-left: 16px;
    padding-right: 16px;
  }
}


/* =========================================================
   IB ABOGADOS · MOBILE FIRST + ESTILO CONCURSO DE ACREEDORES
   ========================================================= */

:root{
  --navy:#0f2940;
  --navy2:#173b58;
  --orange:#f7931e;
  --orange2:#ffad42;
  --cream:#fff7ed;
  --ice:#eef4f8;
  --white:#fff;
  --ink:#1d2b38;
  --muted:#667482;
  --line:#d7e1e8;
  --shadow:0 14px 40px rgba(13,41,64,.12);
}

html{
  width:100%;
  overflow-x:hidden;
  touch-action:pan-y;
  background:#fff;
}

body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  touch-action:pan-y;
  background:
    radial-gradient(circle at 92% 8%, rgba(247,147,30,.12), transparent 22%),
    linear-gradient(180deg,#fff 0,#fbfdff 42%,#fff 100%);
  color:var(--ink);
}

img{
  max-width:100%;
  height:auto;
  user-select:none;
  -webkit-user-drag:none;
  pointer-events:none;
}

a,button,input,select,textarea,summary{
  touch-action:manipulation;
}

.topbar{
  background:rgba(255,255,255,.96);
  border-bottom:1px solid rgba(15,41,64,.08);
  box-shadow:0 6px 22px rgba(15,41,64,.06);
}

.topbar .brand img{
  filter:none;
}

.hero,
.boutique-hero,
.practice-hero{
  position:relative;
  background:
    radial-gradient(circle at 82% 12%,rgba(247,147,30,.18),transparent 29%),
    linear-gradient(145deg,#ffffff 0%,#f6f9fb 64%,#eef4f8 100%);
}

.hero::after,
.boutique-hero::after,
.practice-hero::after{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  width:34%;
  height:5px;
  background:var(--orange);
}

.eyebrow{
  color:var(--orange);
  letter-spacing:.13em;
  font-weight:900;
}

h1,h2,h3{
  color:var(--navy);
}

h1 span,
.practice-hero h1 span,
.boutique-hero h1 span{
  color:var(--orange);
}

.btn{
  background:linear-gradient(135deg,var(--orange),var(--orange2));
  color:#fff;
  box-shadow:0 10px 24px rgba(247,147,30,.22);
}

.btn-ghost{
  background:#fff;
  color:var(--navy);
  border:1px solid var(--line);
  box-shadow:none;
}

.boutique-manifesto,
.practice-side,
.hero-card{
  background:
    linear-gradient(150deg,var(--navy) 0%,var(--navy2) 100%);
  color:#fff;
  box-shadow:0 22px 58px rgba(15,41,64,.20);
  border:1px solid rgba(255,255,255,.08);
}

.boutique-manifesto h2,
.practice-side h2,
.hero-card h2{
  color:#fff;
}

.boutique-manifesto p,
.practice-side p,
.hero-card p{
  color:#d7e3ec;
}

.section{
  position:relative;
}

.section.soft{
  background:
    linear-gradient(180deg,#f5f8fa,#eef4f8);
}

.section-head{
  max-width:900px;
}

.area-card,
.service-card,
.download-card,
.card,
.step{
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
}

.area-card{
  border-top:5px solid var(--orange);
}

.area-card:hover,
.service-card:hover,
.download-card:hover{
  border-color:rgba(247,147,30,.55);
}

.area-number,
.service-card span,
.icon{
  background:var(--orange);
}

.area-kicker{
  color:var(--orange);
}

.area-link{
  color:var(--navy);
}

.area-link:hover{
  color:var(--orange);
}

.boutique-method,
.final-cta,
.leadmagnet{
  background:
    linear-gradient(145deg,var(--navy),var(--navy2));
  color:#fff;
  box-shadow:0 24px 64px rgba(15,41,64,.18);
}

.boutique-method h2,
.final-cta h2,
.leadmagnet h2{
  color:#fff;
}

.method-steps>div{
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.12);
}

.method-steps b{
  background:var(--orange);
}

.visual-library{
  background:
    radial-gradient(circle at 15% 10%,rgba(247,147,30,.10),transparent 22%),
    linear-gradient(180deg,#fff,#f5f8fa);
}

.visual-library-frame{
  background:linear-gradient(145deg,var(--navy),#17384f);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 24px 70px rgba(15,41,64,.18);
}

.resource-home-grid a{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 10px 28px rgba(15,41,64,.06);
}

.resource-home-grid a:hover{
  border-color:var(--orange);
}

.general-lead-form{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 18px 48px rgba(15,41,64,.10);
}

input,select,textarea{
  background:#fff;
  border:1px solid #cdd9e2;
}

input:focus,select:focus,textarea:focus{
  border-color:var(--orange);
  box-shadow:0 0 0 3px rgba(247,147,30,.13);
}

.faq details{
  background:#fff;
  border:1px solid var(--line);
  box-shadow:0 8px 22px rgba(15,41,64,.04);
}

footer{
  background:linear-gradient(145deg,#0c2235,#102d44);
}

/* ===== MOBILE: diseño estable, sin zoom ni desplazamiento lateral ===== */
@media(max-width:620px){

  html,body{
    width:100%;
    max-width:100%;
    overflow-x:hidden!important;
    touch-action:pan-y!important;
  }

  body{
    font-size:15px;
  }

  .topbar{
    min-height:64px;
    height:auto;
    padding:7px 14px;
  }

  .topbar .brand{
    width:118px;
    max-width:118px;
  }

  .topbar .brand img{
    width:118px!important;
    height:48px!important;
    max-width:118px!important;
    max-height:48px!important;
    object-fit:contain;
  }

  .nav{
    max-width:calc(100% - 132px);
  }

  .nav a:not(.btn){
    display:none!important;
  }

  .nav .btn,
  .nav button{
    font-size:11px;
    padding:9px 10px;
    border-radius:10px;
  }

  .hero,
  .boutique-hero,
  .practice-hero{
    display:block;
    width:100%;
    min-height:auto;
    padding:34px 16px 44px;
  }

  .boutique-hero-copy,
  .practice-hero>div{
    max-width:100%;
  }

  h1{
    font-size:clamp(34px,10.5vw,46px)!important;
    line-height:1.02;
    letter-spacing:-.045em;
    margin-bottom:18px;
  }

  h2{
    font-size:clamp(28px,8vw,36px)!important;
    line-height:1.08;
  }

  h3{
    font-size:21px;
    line-height:1.16;
  }

  .lead{
    font-size:17px;
    line-height:1.5;
  }

  .hero-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  .hero-actions .btn{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:11px 10px;
    text-align:center;
    font-size:13px;
  }

  .trust-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px 12px;
    margin-top:18px;
    font-size:12px;
  }

  .boutique-manifesto,
  .practice-side,
  .hero-card{
    margin-top:24px;
    padding:25px 20px;
    border-radius:22px;
  }

  .section{
    width:100%;
    max-width:100%;
    padding:58px 16px;
  }

  .section-head{
    margin-bottom:28px;
  }

  .boutique-areas,
  .service-grid,
  .download-grid,
  .resource-home-grid,
  .cards,
  .three,
  .split,
  .timeline,
  .check-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:16px;
    width:100%;
  }

  .area-card,
  .service-card,
  .download-card,
  .card,
  .step{
    width:100%;
    max-width:100%;
    min-height:0;
    padding:24px 20px;
    border-radius:20px;
  }

  .area-card ul,
  .solution ul{
    padding-left:18px;
  }

  .area-link{
    margin-top:16px;
    padding-top:14px;
  }

  .boutique-method,
  .final-cta,
  .leadmagnet{
    width:auto;
    max-width:calc(100% - 28px);
    margin:0 14px 58px;
    padding:25px 20px;
    border-radius:22px;
  }

  .method-steps{
    gap:9px;
  }

  .method-steps>div{
    padding:13px;
  }

  .visual-library-frame{
    width:100%;
    max-width:100%;
    margin:0 0 20px;
    padding:5px;
    border-radius:18px;
    overflow:hidden;
  }

  .visual-library-frame img{
    width:100%;
    max-width:100%;
    height:auto;
    object-fit:contain;
    transform:none!important;
  }

  .resource-preview-pair{
    width:100%;
    max-width:100%;
    grid-template-columns:1fr 1fr;
    gap:6px;
  }

  .resource-preview-pair img{
    width:100%;
    max-width:100%;
    height:190px;
    object-fit:cover;
    object-position:top;
    transform:none!important;
  }

  .general-lead-form{
    width:100%;
    max-width:100%;
    padding:20px 16px;
    border-radius:19px;
  }

  .field-row{
    display:block!important;
  }

  input,select,textarea{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    font-size:16px!important;
  }

  footer{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:22px;
    width:100%;
    max-width:100%;
    padding:38px 16px 64px;
  }

  footer img{
    width:auto!important;
    height:48px!important;
    max-width:150px!important;
  }

  /* Bloqueo de gestos que alteran el encuadre */
  img,
  .visual-library-frame,
  .resource-preview-pair,
  .magnet-preview{
    touch-action:pan-y!important;
  }

  *{
    max-width:100%;
  }
}


/* =========================================================
   PORTADA · CORRECCIÓN DEFINITIVA DE DESPLAZAMIENTO HORIZONTAL
   ========================================================= */

.boutique-home,
.boutique-home main,
.boutique-home .boutique-hero,
.boutique-home .section,
.boutique-home .boutique-method,
.boutique-home .visual-library,
.boutique-home .resource-home,
.boutique-home footer {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

.boutique-home .boutique-hero,
.boutique-home .boutique-hero-copy,
.boutique-home .boutique-manifesto,
.boutique-home .boutique-areas,
.boutique-home .area-card,
.boutique-home .resource-home-grid,
.boutique-home .resource-home-grid a,
.boutique-home .visual-library-frame,
.boutique-home .general-lead-form,
.boutique-home .contact-direct {
  min-width: 0;
  max-width: 100%;
}

.contact-direct{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  max-width:900px;
  margin:0 0 18px;
}
.contact-direct>div{
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 24px rgba(15,41,64,.05);
}
.contact-direct b{
  display:block;
  color:var(--navy);
  margin-bottom:5px;
}
.contact-direct a,
.contact-direct span{
  color:var(--muted);
  overflow-wrap:anywhere;
}
.footer-address{
  margin:8px 0 0;
  color:#d5e0e8;
  line-height:1.45;
}

@media(max-width:620px){

  .boutique-home{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }

  .boutique-home main,
  .boutique-home .boutique-hero,
  .boutique-home .section,
  .boutique-home .visual-library,
  .boutique-home footer{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }

  .boutique-home .boutique-hero{
    display:block!important;
    grid-template-columns:none!important;
    padding-left:16px!important;
    padding-right:16px!important;
  }

  .boutique-home .boutique-hero-copy,
  .boutique-home .boutique-manifesto{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  .boutique-home .boutique-manifesto{
    margin-top:22px!important;
  }

  .boutique-home .boutique-areas,
  .boutique-home .resource-home-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    max-width:100%!important;
    gap:16px!important;
  }

  .boutique-home .area-card,
  .boutique-home .resource-home-grid a{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
  }

  .boutique-home .area-card h3,
  .boutique-home .area-card p,
  .boutique-home .area-card li,
  .boutique-home .resource-home-grid b,
  .boutique-home .resource-home-grid span{
    max-width:100%!important;
    overflow-wrap:anywhere;
  }

  .boutique-home .boutique-method{
    width:calc(100% - 28px)!important;
    max-width:calc(100% - 28px)!important;
    margin-left:14px!important;
    margin-right:14px!important;
  }

  .boutique-home .visual-library-frame{
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
    overflow:hidden!important;
  }

  .boutique-home .visual-library-frame img{
    display:block;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    object-fit:contain!important;
  }

  .boutique-home .general-lead-form{
    width:100%!important;
    max-width:100%!important;
  }

  .boutique-home .hero-actions{
    width:100%;
    max-width:100%;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  }

  .boutique-home .hero-actions .btn{
    min-width:0!important;
    width:100%!important;
    white-space:normal!important;
  }

  .boutique-home .trust-row{
    width:100%;
    max-width:100%;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  }

  .contact-direct{
    grid-template-columns:minmax(0,1fr);
    width:100%;
    max-width:100%;
  }

  .topbar{
    overflow:hidden;
  }

  .topbar .brand,
  .topbar .brand img{
    flex-shrink:0;
  }
}

.language-switcher{display:flex;gap:5px;align-items:center;margin-left:8px}.language-switcher a{font-size:11px;font-weight:800;padding:6px 7px;border:1px solid #d7e1e8;border-radius:8px;background:#fff;color:#102b40;text-decoration:none}.language-switcher a:hover{border-color:#f59a23;color:#f59a23}@media(max-width:620px){.language-switcher{position:fixed;right:10px;bottom:10px;z-index:9999;background:rgba(255,255,255,.96);padding:5px;border-radius:12px;box-shadow:0 5px 20px rgba(0,0,0,.15)}.language-switcher a{display:block!important;font-size:10px;padding:5px 6px}}

/* =========================================================
   SELECTOR DE IDIOMA VISIBLE · DESKTOP + MOBILE
   ========================================================= */
.lang-switcher{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  margin-right:auto;
  margin-left:18px;
  padding:7px 9px;
  border:1px solid var(--line, #d8e2e8);
  border-radius:14px;
  background:#fff;
  box-shadow:0 6px 18px rgba(15,41,64,.06);
  white-space:nowrap;
}
.lang-label{
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  color:var(--navy,#102b40);
  margin-right:2px;
}
.lang-option{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:34px;
  padding:5px 8px;
  border-radius:9px;
  font-size:12px;
  font-weight:900;
  color:var(--navy,#102b40);
  background:#f7f9fb;
  border:1px solid transparent;
  transition:.18s ease;
}
.lang-option:hover{
  border-color:var(--orange,#f59a23);
  background:#fff7ed;
}
.lang-option[aria-current="page"]{
  color:#fff;
  background:var(--navy,#102b40);
  border-color:var(--navy,#102b40);
}
.lang-option .flag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:16px;
  flex:0 0 22px;
  overflow:hidden;
  border-radius:2px;
  font-size:16px;
  line-height:1;
}
.flag-ca{
  position:relative;
  background:
    linear-gradient(
      to bottom,
      #f6c500 0%, #f6c500 11.11%,
      #d71920 11.11%, #d71920 22.22%,
      #f6c500 22.22%, #f6c500 33.33%,
      #d71920 33.33%, #d71920 44.44%,
      #f6c500 44.44%, #f6c500 55.55%,
      #d71920 55.55%, #d71920 66.66%,
      #f6c500 66.66%, #f6c500 77.77%,
      #d71920 77.77%, #d71920 88.88%,
      #f6c500 88.88%, #f6c500 100%
    );
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);
}
.flag-ca i{display:none}

/* Desktop: selector prominent between logo and menu */
@media(min-width:981px){
  .topbar{
    min-height:84px;
  }
  .lang-switcher{
    order:1;
  }
  .topbar .brand{order:0}
  .topbar .nav{order:2}
  .lang-label{display:inline-block}
}

/* Tablet */
@media(max-width:980px) and (min-width:621px){
  .lang-switcher{
    margin-left:10px;
    gap:5px;
  }
  .lang-label{display:none}
  .lang-option{padding:5px 7px}
}

/* Mobile: language selector becomes the FIRST navigation row */
@media(max-width:620px){
  .topbar{
    display:grid !important;
    grid-template-columns:auto 1fr;
    grid-template-areas:
      "brand nav"
      "lang lang";
    gap:6px 10px;
    padding:7px 12px 9px;
    min-height:104px;
    overflow:visible !important;
  }
  .topbar .brand{
    grid-area:brand;
    margin:0;
  }
  .topbar .nav{
    grid-area:nav;
    justify-self:end;
    max-width:100%;
  }
  .lang-switcher{
    grid-area:lang;
    width:100%;
    margin:0;
    padding:6px;
    display:grid;
    grid-template-columns:auto repeat(4,1fr);
    gap:5px;
    border-radius:12px;
    background:#f8fafb;
    box-shadow:none;
  }
  .lang-label{
    display:flex;
    align-items:center;
    padding:0 6px;
    font-size:10px;
  }
  .lang-option{
    width:100%;
    justify-content:center;
    padding:6px 5px;
    min-height:38px;
    font-size:12px;
    background:#fff;
    border-color:#dce4e9;
  }
  .lang-option[aria-current="page"]{
    background:var(--navy,#102b40);
    border-color:var(--navy,#102b40);
  }
  .lang-option .flag{
    width:20px;
    flex-basis:20px;
    height:14px;
    font-size:15px;
  }
  .topbar .nav a:not(.btn){
    display:none !important;
  }
}


/* Senyera real para selector de idioma catalán */
.lang-option img.flag-ca-img{
  display:block !important;
  width:24px !important;
  height:16px !important;
  max-width:24px !important;
  min-width:24px !important;
  object-fit:cover !important;
  border-radius:2px;
  box-shadow:0 0 0 1px rgba(0,0,0,.12);
  flex:0 0 24px;
  pointer-events:none;
}
@media(max-width:620px){
  .lang-option img.flag-ca-img{
    width:22px !important;
    height:15px !important;
    max-width:22px !important;
    min-width:22px !important;
    flex-basis:22px;
  }
}


/* ===== Banderas compactas del selector de idiomas ===== */
.lang-option .flag,
.lang-option img.flag-ca-img{
  width:18px !important;
  height:12px !important;
  min-width:18px !important;
  max-width:18px !important;
  flex:0 0 18px !important;
  font-size:13px !important;
  line-height:12px !important;
  object-fit:cover !important;
  border-radius:2px;
}
.lang-option{
  gap:4px !important;
}
@media(max-width:620px){
  .lang-option .flag,
  .lang-option img.flag-ca-img{
    width:17px !important;
    height:11px !important;
    min-width:17px !important;
    max-width:17px !important;
    flex-basis:17px !important;
    font-size:12px !important;
    line-height:11px !important;
  }
}


/* ===== Cuatro banderas exactamente del mismo tamaño ===== */
.lang-option img.lang-flag{
  display:block !important;
  width:18px !important;
  height:12px !important;
  min-width:18px !important;
  max-width:18px !important;
  min-height:12px !important;
  max-height:12px !important;
  flex:0 0 18px !important;
  object-fit:cover !important;
  object-position:center !important;
  border-radius:2px !important;
  margin:0 !important;
  padding:0 !important;
  box-shadow:0 0 0 1px rgba(0,0,0,.10);
}
@media(max-width:620px){
  .lang-option img.lang-flag{
    width:17px !important;
    height:11px !important;
    min-width:17px !important;
    max-width:17px !important;
    min-height:11px !important;
    max-height:11px !important;
    flex:0 0 17px !important;
  }
}


/* =========================================================
   FIX FINAL: TODAS LAS BANDERAS DEL SELECTOR = MISMO TAMAÑO
   ========================================================= */
.lang-switcher .lang-option img,
.lang-switcher .lang-option img.lang-flag,
.lang-switcher img.flag-ca-img,
.lang-switcher .flag-ca,
.lang-switcher .flag-es,
.lang-switcher .flag-en,
.lang-switcher .flag-fr {
  display:inline-block !important;
  box-sizing:border-box !important;
  width:18px !important;
  height:12px !important;
  min-width:18px !important;
  max-width:18px !important;
  min-height:12px !important;
  max-height:12px !important;
  flex:0 0 18px !important;
  object-fit:cover !important;
  object-position:center !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:2px !important;
  vertical-align:middle !important;
  transform:none !important;
}
@media (max-width:620px){
  .lang-switcher .lang-option img,
  .lang-switcher .lang-option img.lang-flag,
  .lang-switcher img.flag-ca-img,
  .lang-switcher .flag-ca,
  .lang-switcher .flag-es,
  .lang-switcher .flag-en,
  .lang-switcher .flag-fr {
    width:17px !important;
    height:11px !important;
    min-width:17px !important;
    max-width:17px !important;
    min-height:11px !important;
    max-height:11px !important;
    flex:0 0 17px !important;
  }
}
