/* Blog de Hermanos Alapont (listado, detalle y guías en los servicios) — 05-nov-2026
   Colores y tipografía de la web: Montserrat, pizarra y naranja Alapont. */

.bl{--bl-ink:#010d14;--bl-slate:#404461;--bl-deep:#2b2e40;--bl-orange:#EE7320;--bl-orange-dk:#d4611a;--bl-muted:#5E5E5E;--bl-mist:#f4f5f7;font-family:'Montserrat',sans-serif}
.bl a:focus-visible{outline:3px solid var(--bl-orange);outline-offset:3px}

/* Hero compacto: foto real de la Strugal Store y barra naranja como la del slider de la home */
.bl-hero{position:relative;background:var(--bl-deep) url('../images/alapont-strugal/interior-strugal-store.jpg') center 60%/cover no-repeat;padding:40px 0 36px;color:#fff}
.bl-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(43,46,64,.94) 0%,rgba(43,46,64,.82) 50%,rgba(43,46,64,.45) 100%)}
.bl-hero .container{position:relative}
.bl-hero__inner{display:flex;gap:18px;align-items:stretch;max-width:940px}
.bl-hero__bar{flex:0 0 8px;background:var(--bl-orange);border-radius:2px}
.bl-hero__eyebrow{display:block;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--bl-orange);margin-bottom:10px}
.bl-hero h1{font-size:clamp(28px,3.6vw,46px);line-height:1.15;font-weight:700;color:#fff;margin:0 0 14px}
.bl-hero p{font-size:17px;line-height:1.6;color:rgba(255,255,255,.88);margin:0}
@media (min-width:992px){.bl-hero{padding:150px 0 48px}}

/* Chips de categoría */
.bl-chips{display:flex;flex-wrap:wrap;gap:10px;margin:40px 0 8px;padding:0;list-style:none}
.bl-chips a{display:inline-block;padding:9px 18px;border-radius:999px;border:1px solid #d5d7df;background:#fff;color:var(--bl-slate);font-size:14px;font-weight:600;line-height:1.2;transition:background-color .2s,color .2s,border-color .2s}
.bl-chips a:hover{border-color:var(--bl-orange);color:var(--bl-orange)}
.bl-chips a[aria-current="page"]{background:var(--bl-orange);border-color:var(--bl-orange);color:#fff}
@media (max-width:767px){.bl-chips{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px;margin-top:28px}.bl-chips::-webkit-scrollbar{display:none}.bl-chips a{white-space:nowrap}}

/* Post destacado */
.bl-featured{display:grid;grid-template-columns:1fr;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 10px 30px rgba(1,13,20,.08);margin:28px 0 8px;color:inherit}
.bl-featured__img{aspect-ratio:16/9;overflow:hidden;background:var(--bl-mist)}
.bl-featured__img img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.bl-featured__body{padding:28px 24px;display:flex;flex-direction:column;justify-content:center}
.bl-featured h2{font-size:clamp(22px,2.2vw,30px);line-height:1.25;font-weight:700;color:var(--bl-ink);margin:8px 0 12px}
.bl-featured p{color:var(--bl-muted);font-size:16px;line-height:1.6;margin:0 0 16px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.bl-featured__more{color:var(--bl-orange);font-weight:600}
.bl-featured .bl-date{margin-top:0}
.bl-featured:hover .bl-featured__img img{transform:scale(1.03)}
@media (min-width:992px){.bl-featured{grid-template-columns:55% 45%}.bl-featured__img{position:relative;aspect-ratio:auto;min-height:360px}.bl-featured__img img{position:absolute;inset:0}.bl-featured__body{padding:40px;border-left:6px solid var(--bl-orange)}}

/* Rejilla de tarjetas */
.bl-grid{margin-top:28px;margin-bottom:24px}
.bl-card{display:flex;flex-direction:column;height:100%;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 6px 20px rgba(1,13,20,.07);color:inherit;transition:transform .25s ease,box-shadow .25s ease}
.bl-card:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(1,13,20,.12)}
.bl-card__img{aspect-ratio:16/9;overflow:hidden;background:var(--bl-mist)}
.bl-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.bl-card:hover .bl-card__img img{transform:scale(1.04)}
.bl-card__body{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px}
.bl-label{display:block;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--bl-orange)}
.bl-card h3{font-size:18px;line-height:1.35;font-weight:600;color:var(--bl-ink);margin:8px 0 10px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bl-card p{font-size:15px;line-height:1.55;color:var(--bl-muted);margin:0 0 16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bl-date{margin-top:auto;font-size:13px;color:#8a8d99}
.bl-empty{padding:40px 0;color:var(--bl-muted)}

/* Paginación con enlaces reales (rastreable por Google) */
.bl-pager{margin:8px 0 56px}
.bl-pager ul{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.bl-pager li>a,.bl-pager li>span{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;height:44px;padding:0 16px;border-radius:999px;border:1px solid #d5d7df;background:#fff;color:var(--bl-slate);font-size:15px;font-weight:600;line-height:1}
.bl-pager li>a:hover{border-color:var(--bl-orange);color:var(--bl-orange)}
.bl-pager [aria-current="page"]{background:var(--bl-orange);border-color:var(--bl-orange);color:#fff}
@media (max-width:575px){.bl-pager__txt{display:none}}


/* Franja de llamada a la acción */
.bl-cta{background:var(--bl-slate);color:#fff;padding:56px 0}
.bl-cta h2{color:#fff;font-size:clamp(24px,2.6vw,34px);line-height:1.2;font-weight:700;margin:0 0 10px}
.bl-cta p{color:rgba(255,255,255,.85);font-size:16px;margin:0}
.bl-cta__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.bl-btn{display:inline-block;padding:13px 24px;border-radius:999px;font-weight:600;font-size:15px;line-height:1.2;border:2px solid var(--bl-orange);transition:background-color .2s,color .2s,border-color .2s}
.bl-btn--solid{background:var(--bl-orange);color:#fff}
.bl-btn--solid:hover{background:var(--bl-orange-dk);border-color:var(--bl-orange-dk);color:#fff}
.bl-btn--ghost{border-color:#fff;color:#fff}
.bl-btn--ghost:hover{background:#fff;color:var(--bl-slate)}
@media (min-width:992px){.bl-cta__wrap{display:flex;align-items:center;justify-content:space-between;gap:40px}.bl-cta__actions{margin-top:0;flex:0 0 auto}}

/* Bloque «Sigue leyendo» / «Guías útiles»: detalle del post y páginas de servicio */
.bl-more{background:var(--bl-mist);padding:56px 0 64px}
.bl-more__head h2{font-size:clamp(22px,2.2vw,30px);line-height:1.25;font-weight:700;color:var(--bl-ink);margin:0 0 6px}
.bl-more__head p{font-size:16px;color:var(--bl-muted);margin:0}
.bl-more__head a{color:var(--bl-orange-dk);font-weight:600}
.bl-more .bl-grid{margin:24px 0 0}

/* ===== Detalle del post ===== */
/* Cabecera: texto a la izquierda e imagen cuadrada (600×600 en el admin) a la derecha */
.bd-head{background:var(--bl-deep);color:#fff;padding:26px 0 36px}
.bd-grid{display:grid;gap:28px}
.bd-crumbs ol{display:flex;flex-wrap:wrap;gap:4px 8px;list-style:none;margin:0 0 22px;padding:0;font-size:13px;line-height:1.5;color:rgba(255,255,255,.66)}
.bd-crumbs li+li::before{content:"›";margin-right:8px;color:rgba(255,255,255,.45)}
.bd-crumbs a{color:rgba(255,255,255,.88)}
.bd-crumbs a:hover{color:var(--bl-orange)}
.bd-title{display:flex;gap:18px;align-items:stretch}
.bd-head .bl-label{color:var(--bl-orange)}
.bd-head h1{font-size:clamp(28px,3.4vw,44px);line-height:1.18;font-weight:700;color:#fff;margin:10px 0 16px}
.bd-meta{font-size:14px;color:rgba(255,255,255,.78);margin:0}
.bd-meta span+span::before{content:"·";margin:0 8px}
.bd-cover img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;background:var(--bl-mist);box-shadow:0 18px 40px rgba(1,13,20,.25)}
@media (min-width:992px){.bd-head{padding:36px 0 56px}.bd-grid{grid-template-columns:minmax(0,1fr) 400px;align-items:center;gap:56px}.bd-cover img{aspect-ratio:1/1}}

/* Cuerpo del artículo: ancho de lectura cómodo */
.bd-body{max-width:740px;margin:0 auto;padding:44px 16px 0;font-size:17px;line-height:1.75;color:#30333f}
.bd-body h2{font-size:clamp(23px,2.2vw,29px);line-height:1.3;font-weight:700;color:var(--bl-ink);margin:2em 0 .7em}
.bd-body h3{font-size:21px;line-height:1.35;font-weight:600;color:var(--bl-ink);margin:1.8em 0 .6em}
.bd-body h4{font-size:18px;line-height:1.4;font-weight:600;color:var(--bl-ink);margin:1.6em 0 .5em}
.bd-body>:first-child{margin-top:0}
.bd-body p{margin:0 0 1.15em}
.bd-body a{color:var(--bl-orange-dk);text-decoration:underline;text-underline-offset:3px}
.bd-body a:hover{color:var(--bl-orange)}
.bd-body strong{color:var(--bl-ink)}
.bd-body ul,.bd-body ol{margin:0 0 1.2em;padding-left:1.3em}
.bd-body li{margin-bottom:.45em}
.bd-body ul li{list-style:disc}
.bd-body ol li{list-style:decimal}
.bd-body li::marker{color:var(--bl-orange)}
.bd-body img{max-width:100%!important;height:auto!important;border-radius:10px;margin:.6em 0}
.bd-body table{width:100%;border-collapse:collapse;margin:1.4em 0;font-size:15px;line-height:1.5}
.bd-body tr:first-child td,.bd-body th{background:var(--bl-mist);font-weight:600;color:var(--bl-ink)}
.bd-body td,.bd-body th{padding:10px 12px;border-bottom:1px solid #e3e5eb;text-align:left;vertical-align:top}
.bd-body td p,.bd-body th p{margin:0}
.bd-body blockquote{margin:1.4em 0;padding:.2em 0 .2em 1.1em;border-left:4px solid var(--bl-orange);color:var(--bl-muted)}
@media (max-width:767px){.bd-body{font-size:16.5px}.bd-body table{display:block;overflow-x:auto}}

/* Nota con enlace al servicio */
.bd-note{margin:2.2em 0 0;padding:20px 22px;border-radius:12px;background:var(--bl-mist);border-left:6px solid var(--bl-orange);font-size:16px;line-height:1.6}

/* Pie del artículo: categoría y compartir */
.bd-foot{max-width:740px;margin:40px auto 56px;padding:0 16px}
.bd-foot__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px 28px;padding-top:24px;border-top:1px solid #e3e5eb}
.bd-cats{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--bl-slate)}
.bd-cats a{display:inline-block;padding:8px 16px;border-radius:999px;border:1px solid #d5d7df;color:var(--bl-slate);line-height:1.2}
.bd-cats a:hover{border-color:var(--bl-orange);color:var(--bl-orange)}
.bd-share{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:var(--bl-slate)}
.bd-share a{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:var(--bl-mist);color:var(--bl-slate);font-size:18px;transition:background-color .2s,color .2s}
.bd-share a:hover{background:var(--bl-orange);color:#fff}

@media (prefers-reduced-motion:reduce){.bl *{transition:none!important}.bl-card:hover{transform:none}.bl-card:hover .bl-card__img img,.bl-featured:hover .bl-featured__img img{transform:none}}
