.case-shell{background:#edf0f2;padding:18px 0 42px;color:#06182c}
.case-frame{background:#fff;border:1px solid #d8dee3;border-top:3px solid #d70000;border-radius:12px;overflow:hidden;box-shadow:0 10px 30px rgba(0,23,43,.06)}
.case-crumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:14px 24px;border-bottom:1px solid #e2e6e9;font-size:12px;color:#65717c}
.case-crumb a{color:#23384a;text-decoration:none}.case-crumb a:hover{text-decoration:underline}
.case-hero{display:grid;grid-template-columns:minmax(0,.92fr) minmax(440px,1.08fr);min-height:520px}
.case-hero-copy{padding:clamp(34px,3.5vw,48px);display:flex;flex-direction:column;justify-content:center;background:linear-gradient(135deg,#fff 0%,#f7f8f9 100%)}
.case-kicker{display:block;color:#d70000;text-transform:uppercase;font-weight:800;letter-spacing:.11em;font-size:12px;margin-bottom:14px}
.case-hero h1{font-family:'Archivo',sans-serif;font-size:clamp(34px,3.8vw,56px);line-height:1;text-transform:uppercase;letter-spacing:-.035em;margin:0 0 20px;max-width:16ch}
.case-hero p{font-size:17px;line-height:1.65;color:#455563;max-width:58ch;margin:0 0 28px}
.case-hero-media{margin:0;position:relative;height:600px;min-height:0;overflow:hidden;background:#071b2e}
.case-hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 44%;display:block}
.case-hero-media::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,23,43,.52),transparent 45%)}
.case-hero-media figcaption{position:absolute;left:24px;bottom:20px;z-index:1;color:#fff;font-size:12px;text-transform:uppercase;font-weight:800;letter-spacing:.06em}
.case-button{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;width:max-content;min-height:48px;padding:0 20px;border:1px solid #143047;border-radius:5px;color:#06182c;text-decoration:none;font-size:13px;font-weight:800;text-transform:uppercase}
.case-button:hover{background:#06182c;color:#fff}.case-button.is-red{background:#d70000;border-color:#d70000;color:#fff}.case-button.is-red:hover{background:#b90000}
.case-facts{display:grid;grid-template-columns:repeat(3,1fr);background:#06182c;color:#fff}
.case-facts div{display:flex;align-items:center;gap:14px;padding:23px 28px;border-left:1px solid rgba(255,255,255,.16)}.case-facts div:first-child{border-left:0}
.case-facts b{color:#d70000;font-size:14px}.case-facts span{font-size:13px;font-weight:700;line-height:1.35}
.case-story{display:grid;grid-template-columns:repeat(3,1fr);gap:0;padding:clamp(42px,5vw,70px)}
.case-story section{padding:4px clamp(22px,3vw,40px);border-left:1px solid #d8dee3}.case-story section:first-child{border-left:0;padding-left:0}.case-story section:last-child{padding-right:0}
.case-number{color:#d70000;font-weight:900;font-size:13px}.case-story h2,.case-section-head h2,.case-transparency h2,.case-cta h2{font-family:'Archivo',sans-serif;text-transform:uppercase;line-height:1.06;margin:12px 0 14px;font-size:clamp(22px,2.3vw,34px)}
.case-story p,.case-story a,.case-section-head p,.case-transparency p,.case-cta p{font-size:14px;line-height:1.65;color:#4b5a66}.case-story a{color:#06182c;font-weight:700}
.case-gallery-section{background:#f3f5f6;border-top:1px solid #dce1e5;border-bottom:1px solid #dce1e5;padding:clamp(42px,5vw,68px)}
.case-section-head{max-width:680px;margin-bottom:28px}.case-section-head p{margin:0}
.case-gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}
.case-photo{grid-column:span 3;position:relative;margin:0;min-height:430px;border-radius:8px;overflow:hidden;background:#06182c}.case-photo.is-featured{grid-column:span 6;grid-row:auto;min-height:430px}.case-photo:nth-child(4),.case-photo:nth-child(5){grid-column:span 6;min-height:460px}
.case-photo img{width:100%;height:100%;object-fit:cover;display:block}.case-photo:nth-child(1) img,.case-photo:nth-child(2) img{object-position:center 36%}
.case-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,23,43,.86),transparent 46%)}
.case-photo figcaption{position:absolute;left:18px;right:18px;bottom:16px;z-index:1;color:#fff}.case-photo figcaption span{font-size:12px;text-transform:uppercase;font-weight:900;letter-spacing:.05em;color:#fff}.case-photo figcaption p{font-size:12px;line-height:1.4;margin:5px 0 0;color:rgba(255,255,255,.78)}
.case-transparency{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(30px,5vw,80px);align-items:center;padding:clamp(42px,5vw,68px);border-bottom:1px solid #dce1e5}.case-transparency p{margin:0}
.case-cta{display:flex;align-items:center;justify-content:space-between;gap:34px;padding:clamp(36px,4vw,54px);background:#06182c;color:#fff}.case-cta h2{margin-bottom:8px;max-width:720px}.case-cta p{color:rgba(255,255,255,.75);margin:0}.case-cta .case-kicker{margin-bottom:8px}
@media(max-width:900px){.case-hero{grid-template-columns:1fr}.case-hero-media{min-height:440px}.case-facts{grid-template-columns:1fr}.case-facts div{border-left:0;border-top:1px solid rgba(255,255,255,.16)}.case-facts div:first-child{border-top:0}.case-story{grid-template-columns:1fr}.case-story section,.case-story section:first-child,.case-story section:last-child{padding:24px 0;border-left:0;border-top:1px solid #d8dee3}.case-story section:first-child{border-top:0;padding-top:0}.case-photo,.case-photo.is-featured{grid-column:span 6;grid-row:auto;min-height:460px}.case-transparency{grid-template-columns:1fr}.case-cta{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.case-shell{padding-top:10px}.case-frame{border-radius:8px}.case-crumb{padding:12px 16px}.case-hero-copy,.case-story,.case-gallery-section,.case-transparency,.case-cta{padding:30px 20px}.case-hero h1{font-size:36px}.case-hero p{font-size:15px}.case-hero-media{height:430px;min-height:0}.case-gallery{grid-template-columns:1fr}.case-photo,.case-photo.is-featured,.case-photo:nth-child(4),.case-photo:nth-child(5){grid-column:1;min-height:430px}.case-button{width:100%}}

/* Cierre del caso con dos continuaciones (2026-08-25): ficha real del
   producto + consulta precargada. .case-cta tiene fondo navy, por eso el
   boton secundario necesita tinta clara: el .case-button base es tinta
   oscura y resultaria ilegible sobre ese fondo. */
.case-cta-actions{display:flex;flex-direction:column;gap:12px;flex-shrink:0}
.case-button.is-ghost{background:none;border-color:rgba(255,255,255,.5);color:#fff}
.case-button.is-ghost:hover{background:rgba(255,255,255,.1);border-color:#fff;color:#fff}
@media(max-width:900px){.case-cta-actions{width:100%}}
@media(max-width:600px){.case-cta-actions .case-button{width:100%}}

/* Objetivos tactiles (Lote 4, 2026-08-25). Solo bajo pointer:coarse.
   .case-crumb a se quedaba en 42px de ancho por dos pixeles; el enlace
   de cierre de cada capitulo es un CTA autonomo en su propia linea, no
   texto dentro de un parrafo, asi que se le da caja de 44px. */
@media (pointer:coarse){
  .case-crumb a{display:inline-block;padding:15px 8px}
  .case-story section>a{display:inline-flex;align-items:center;min-height:44px}
}