/* BricoDato V10 · Ceramic Connection FINAL CSS 5.24.5 */
/* 1. BASE COMPLETA 5.24 */
/* BricoDato V10 · Ceramic Connection 5.24 */
.cc524{--cc-blue:#0e3f72;--cc-orange:#f58220;--cc-ink:#18364f;--cc-muted:#63788c;--cc-line:#dce7f0}
.cc524-shell{max-width:1080px;margin:0 auto;padding:22px 20px 42px}
.cc524-breadcrumb{font-size:.9rem;color:#718397;margin:0 0 14px}
.cc524-breadcrumb a{color:#0d5b9e;text-decoration:none}
.cc524-hero{
 display:grid;grid-template-columns:1.04fr .96fr;gap:20px;overflow:hidden;
 border-radius:24px;background:linear-gradient(135deg,#0b3d6e 0%,#155f9f 58%,#eef5fa 58%,#f9fbfd 100%);
 box-shadow:0 18px 42px rgba(13,52,83,.13)
}
.cc524-hero-copy{padding:30px 27px;color:#fff}
.cc524-kicker{display:inline-flex;align-items:center;gap:7px;color:#f58220;font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:.78rem}
.cc524-hero h1{margin:8px 0 12px;font-size:clamp(2rem,4vw,3.25rem);line-height:1;color:#fff}
.cc524-hero p{margin:0;color:rgba(255,255,255,.92);line-height:1.65}
.cc524-badges{display:flex;flex-wrap:wrap;gap:8px;margin:17px 0}
.cc524-badges span{padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.2);font-weight:800;font-size:.88rem}
.cc524-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}
.cc524-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 14px;border-radius:11px;text-decoration:none;font-weight:900}
.cc524-btn-primary{background:#fff;color:#0b3d6e}
.cc524-btn-soft{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.22)}
.cc524-hero-media{position:relative;min-height:390px}
.cc524-hero-media img{width:100%;height:100%;object-fit:cover;display:block}
.cc524-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.35))}
.cc524-photo-credit{position:absolute;right:12px;bottom:10px;z-index:2;color:#fff;font-size:.78rem;background:rgba(0,0,0,.48);padding:6px 8px;border-radius:8px}

.cc524-section{margin-top:28px}
.cc524-head{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:14px}
.cc524-head h2{margin:3px 0 0;color:#123a5b;font-size:1.65rem}
.cc524-head p{margin:0;max-width:540px;color:#62798d;line-height:1.55}

.cc524-space-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.cc524-space-card{
 position:relative;min-height:220px;overflow:hidden;border-radius:20px;
 box-shadow:0 13px 28px rgba(12,49,82,.09);background:#eaf1f6;text-decoration:none
}
.cc524-space-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}
.cc524-space-card:hover img{transform:scale(1.025)}
.cc524-space-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,25,44,.05),rgba(4,25,44,.75))}
.cc524-space-copy{position:absolute;left:16px;right:16px;bottom:15px;z-index:2;color:#fff}
.cc524-space-copy strong{display:block;font-size:1.2rem;margin-bottom:4px}
.cc524-space-copy span{font-size:.9rem;line-height:1.35;color:rgba(255,255,255,.9)}

.cc524-material-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px}
.cc524-material{
 padding:15px 13px;border-radius:16px;border:1px solid var(--cc-line);background:#fff;
 text-decoration:none;box-shadow:0 9px 22px rgba(11,44,74,.05)
}
.cc524-material strong{display:block;color:#17476e;margin-bottom:5px}
.cc524-material span{color:#677d90;font-size:.86rem;line-height:1.35}
.cc524-material em{display:inline-flex;margin-top:10px;color:#0c5a9d;font-style:normal;font-weight:850;font-size:.84rem}

.cc524-value{
 display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px
}
.cc524-value div{padding:15px;border-radius:17px;background:#f7fbfe;border:1px solid #dbe8f2}
.cc524-value b{display:block;color:#133f64;margin-bottom:6px}
.cc524-value span{color:#637a8e;line-height:1.45;font-size:.9rem}

.cc524-pick{
 display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:stretch
}
.cc524-pick-photo{overflow:hidden;border-radius:20px;min-height:280px;background:#eef3f7}
.cc524-pick-photo img{width:100%;height:100%;object-fit:cover;display:block}
.cc524-checklist{padding:20px;border-radius:20px;border:1px solid var(--cc-line);background:#fff}
.cc524-checklist h3{margin:0 0 12px;color:#123d60}
.cc524-checklist ul{margin:0;padding-left:20px;color:#405f78;line-height:1.65}
.cc524-checklist li{margin-bottom:7px}

.cc524-footer-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}
.cc524-disclosure{margin-top:24px;padding:14px 16px;border-radius:14px;background:#f8fafc;border:1px solid #dee7ee;color:#576c7d;font-size:.9rem;line-height:1.5}
.cc524-disclosure strong{color:#2a485f}
.cc524-source{margin-top:10px;color:#7b8a99;font-size:.82rem}

.cc524-hub-card{
 display:grid!important;grid-template-columns:180px 1fr;gap:0;overflow:hidden;border-radius:18px;
 border:1px solid #dce7f0;background:#fff;text-decoration:none;box-shadow:0 10px 25px rgba(12,49,82,.06)
}
.cc524-hub-card img{width:100%;height:100%;object-fit:cover;display:block;min-height:180px}
.cc524-hub-copy{padding:18px}
.cc524-hub-copy h2{margin:5px 0 8px;color:#123d60}
.cc524-hub-copy p{margin:0;color:#62798d;line-height:1.5}
.cc524-hub-copy strong{display:inline-block;margin-top:10px;color:#0d5d9f}

@media(max-width:940px){
 .cc524-material-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .cc524-value{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
 .cc524-hero{grid-template-columns:1fr;background:linear-gradient(180deg,#0b3d6e 0%,#155f9f 47%,#f7fafc 47%)}
 .cc524-hero-media{min-height:280px}
 .cc524-space-grid{grid-template-columns:1fr}
 .cc524-pick{grid-template-columns:1fr}
 .cc524-head{display:block}
 .cc524-head p{margin-top:8px}
 .cc524-hub-card{grid-template-columns:1fr}
 .cc524-hub-card img{height:200px}
}
@media(max-width:560px){
 .cc524-material-grid,.cc524-value{grid-template-columns:1fr}
}


/* 2. VISUAL 5.24.2 */
/* BricoDato V10 · Ceramic Connection visual cleanup 5.24.2 */
.cc5242-hero-gallery{min-height:390px;padding:16px;display:grid;grid-template-columns:1.2fr .8fr;grid-template-rows:1fr 1fr;gap:10px;background:#edf4f8}
.cc5242-hero-gallery figure{position:relative;margin:0;overflow:hidden;border-radius:17px;background:#fff;box-shadow:0 10px 24px rgba(18,53,82,.10)}
.cc5242-hero-gallery figure:first-child{grid-row:1 / span 2}
.cc5242-hero-gallery img{width:100%;height:100%;display:block;object-fit:cover}
.cc5242-hero-gallery figcaption{position:absolute;left:9px;right:9px;bottom:9px;padding:7px 9px;border-radius:9px;background:rgba(8,31,50,.72);color:#fff;font-size:.78rem;font-weight:850}
.cc524-space-card img{object-position:center!important}
.cc5242-material-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.cc5242-material-card{display:flex;flex-direction:column;overflow:hidden;border-radius:20px;border:1px solid #dce7f0;background:#fff;box-shadow:0 11px 26px rgba(11,44,74,.06);text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.cc5242-material-card:hover{transform:translateY(-2px);box-shadow:0 15px 32px rgba(11,44,74,.11)}
.cc5242-material-media{height:190px;display:block;overflow:hidden;background:#f4f7f9}
.cc5242-material-media img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .25s ease}
.cc5242-material-card:hover .cc5242-material-media img{transform:scale(1.025)}
.cc5242-material-body{display:flex;flex:1;flex-direction:column;padding:15px 15px 16px}
.cc5242-material-body strong{display:block;margin-bottom:6px;color:#17476e;font-size:1.04rem}
.cc5242-material-body span{display:block;color:#657b8f;font-size:.89rem;line-height:1.45}
.cc5242-material-body em{display:inline-flex;margin-top:auto;padding-top:12px;color:#0d5d9f;font-style:normal;font-weight:850;font-size:.86rem}
@media(min-width:981px){.cc5242-material-card:nth-child(4){grid-column:1 / 2;margin-left:50%}.cc5242-material-card:nth-child(5){grid-column:2 / 3;margin-left:50%}}
@media(max-width:980px){.cc5242-material-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.cc5242-hero-gallery{min-height:320px;grid-template-columns:1fr 1fr;grid-template-rows:190px 120px}.cc5242-hero-gallery figure:first-child{grid-column:1 / -1;grid-row:auto}}
@media(max-width:560px){.cc5242-material-grid{grid-template-columns:1fr}.cc5242-material-media{height:210px}}


/* 3. COMPACTACIÓN 5.24.3 */
/* BricoDato V10 · Ceramic Connection compact layout 5.24.3 */

/* General width / breathing room */
.cc524-shell{
  max-width:1040px!important;
  padding:18px 18px 36px!important;
}

/* Hero: smaller and more balanced */
.cc524-hero{
  grid-template-columns:1fr .9fr!important;
  gap:0!important;
  border-radius:20px!important;
}
.cc524-hero-copy{
  padding:24px 24px!important;
}
.cc524-hero h1{
  font-size:clamp(1.9rem,3vw,2.65rem)!important;
  margin-bottom:10px!important;
}
.cc524-hero p{
  line-height:1.55!important;
}
.cc524-badges{
  margin:14px 0!important;
  gap:7px!important;
}
.cc524-badges span{
  padding:7px 9px!important;
  font-size:.82rem!important;
}
.cc524-actions{
  margin-top:15px!important;
}
.cc524-btn{
  min-height:39px!important;
  padding:0 12px!important;
  font-size:.9rem!important;
}

/* 5.24.2 collage compact */
.cc5242-hero-gallery{
  min-height:300px!important;
  max-height:320px!important;
  padding:12px!important;
  gap:8px!important;
  grid-template-columns:1.15fr .85fr!important;
}
.cc5242-hero-gallery figure{
  border-radius:14px!important;
}
.cc5242-hero-gallery figure:first-child{
  min-height:0!important;
}
.cc5242-hero-gallery figcaption{
  left:7px!important;
  right:7px!important;
  bottom:7px!important;
  padding:6px 8px!important;
  font-size:.74rem!important;
}

/* Section spacing */
.cc524-section{
  margin-top:24px!important;
}
.cc524-head{
  margin-bottom:12px!important;
  gap:16px!important;
}
.cc524-head h2{
  font-size:1.45rem!important;
}
.cc524-head p{
  max-width:500px!important;
  font-size:.92rem!important;
}

/* Space cards smaller */
.cc524-space-grid{
  gap:12px!important;
}
.cc524-space-card{
  min-height:190px!important;
  border-radius:17px!important;
}
.cc524-space-copy{
  left:13px!important;
  right:13px!important;
  bottom:12px!important;
}
.cc524-space-copy strong{
  font-size:1.06rem!important;
}
.cc524-space-copy span{
  font-size:.83rem!important;
}

/* Materials: robust 3 + 2 centered layout */
.cc5242-material-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:12px!important;
}
.cc5242-material-card{
  grid-column:span 2!important;
  border-radius:17px!important;
}
.cc5242-material-card:nth-child(4){
  grid-column:2 / span 2!important;
  margin-left:0!important;
}
.cc5242-material-card:nth-child(5){
  grid-column:4 / span 2!important;
  margin-left:0!important;
}
.cc5242-material-media{
  height:155px!important;
}
.cc5242-material-body{
  padding:13px 13px 14px!important;
}
.cc5242-material-body strong{
  font-size:.98rem!important;
}
.cc5242-material-body span{
  font-size:.84rem!important;
  line-height:1.4!important;
  min-height:0!important;
}
.cc5242-material-body em{
  padding-top:10px!important;
  font-size:.82rem!important;
}

/* Info blocks more compact */
.cc524-value{
  gap:10px!important;
}
.cc524-value div{
  padding:13px!important;
  border-radius:15px!important;
}
.cc524-value span{
  font-size:.86rem!important;
}
.cc524-pick{
  gap:14px!important;
}
.cc524-pick-photo{
  min-height:245px!important;
  border-radius:17px!important;
}
.cc524-checklist{
  padding:17px!important;
  border-radius:17px!important;
}
.cc524-checklist ul{
  line-height:1.55!important;
}

/* Bottom spacing */
.cc524-disclosure{
  margin-top:20px!important;
  padding:12px 14px!important;
}
.cc524-source{
  margin-top:8px!important;
}

/* Tablet */
@media(max-width:900px){
  .cc524-shell{
    max-width:760px!important;
  }
  .cc5242-material-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .cc5242-material-card,
  .cc5242-material-card:nth-child(4),
  .cc5242-material-card:nth-child(5){
    grid-column:auto!important;
  }
  .cc5242-material-card:nth-child(5){
    grid-column:1 / -1!important;
    max-width:50%!important;
    width:100%!important;
    justify-self:center!important;
  }
}

/* Mobile */
@media(max-width:760px){
  .cc524-shell{
    max-width:none!important;
    padding:14px 12px 30px!important;
  }
  .cc524-hero{
    grid-template-columns:1fr!important;
  }
  .cc524-hero-copy{
    padding:22px 18px!important;
  }
  .cc5242-hero-gallery{
    min-height:260px!important;
    max-height:none!important;
    grid-template-columns:1fr 1fr!important;
    grid-template-rows:160px 95px!important;
  }
  .cc5242-hero-gallery figure:first-child{
    grid-column:1 / -1!important;
    grid-row:auto!important;
  }
  .cc5242-material-grid{
    grid-template-columns:1fr!important;
  }
  .cc5242-material-card,
  .cc5242-material-card:nth-child(4),
  .cc5242-material-card:nth-child(5){
    grid-column:auto!important;
    max-width:none!important;
  }
  .cc5242-material-media{
    height:180px!important;
  }
  .cc524-pick{
    grid-template-columns:1fr!important;
  }
}



/* 5.24.6 · cierre Ceramic: fotos únicas + 4 espacios */
.cc5246-hero-photo{min-height:300px;overflow:hidden;background:#edf4f8}
.cc5246-hero-photo img{width:100%;height:100%;min-height:300px;display:block;object-fit:cover;object-position:center}
.cc5246-space-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.cc5246-space-card{position:relative;min-height:190px;overflow:hidden;border-radius:17px;background:#edf3f7;text-decoration:none;box-shadow:0 11px 25px rgba(12,49,82,.08)}
.cc5246-space-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}
.cc5246-space-card:hover img{transform:scale(1.025)}
.cc5246-space-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,28,47,.03),rgba(7,28,47,.78))}
.cc5246-space-copy{position:absolute;left:13px;right:13px;bottom:12px;z-index:2;color:#fff}
.cc5246-space-copy strong{display:block;margin-bottom:4px;font-size:1.04rem}
.cc5246-space-copy span{display:block;font-size:.82rem;line-height:1.38;color:rgba(255,255,255,.92)}
.cc5242-material-media img{object-fit:cover!important;object-position:center!important}
@media(max-width:960px){.cc5246-space-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.cc5246-hero-photo,.cc5246-hero-photo img{min-height:240px}}
@media(max-width:560px){.cc5246-space-grid{grid-template-columns:1fr}}
