/* Capa J&J sobre el tema: paleta del manual (carbón, gris, rojo acento, beige), Bebas Neue + Montserrat + Barlow Condensed */
@font-face{font-family:"Bebas Neue";src:url(fonts/bebas-neue.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Montserrat";src:url(fonts/montserrat-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Montserrat";src:url(fonts/montserrat-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Montserrat";src:url(fonts/montserrat-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Montserrat";src:url(fonts/montserrat-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Montserrat";src:url(fonts/montserrat-800.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url(fonts/barlow-condensed.woff2) format("woff2");font-weight:700;font-display:swap}

:root{
  --theme-color1:#D62828!important;--theme-color1-rgb:214,40,40!important;--theme-color1-darker:#B01E1E!important;--theme-color1-lighter:#E25555!important;
  --theme-color2:#1F2428!important;--theme-color2-rgb:31,36,40!important;--theme-color2-lighter:#2C3338!important;
  --theme-color3:#B01E1E!important;--theme-color3-rgb:176,30,30!important;
  --headings-color:#1F2428!important;--text-color:#5B6166!important;
  --body-font-family:"Montserrat",system-ui,sans-serif!important;--heading-font-family:"Bebas Neue",Impact,sans-serif!important;
  --jj-carbon:#1F2428;--jj-gris:#6B7177;--jj-claro:#E9ECEF;--jj-rojo:#D62828;--jj-beige:#D9C7B2;
  --jj-label:"Barlow Condensed","Montserrat",sans-serif;
}
body{font-family:var(--body-font-family);color:var(--text-color)}
h1,h2,h3,h4,.title,.section-title .title,.tm-sc-section-title .title,.service-title,.icon-box-title,.post-title,.entry-title,
.elementor-heading-title{font-family:var(--heading-font-family)!important;font-weight:400!important;letter-spacing:.01em;text-transform:uppercase;line-height:1.02!important}
h5,h6{font-family:"Montserrat",sans-serif!important;font-weight:700!important;letter-spacing:0;text-transform:none}
.icon-box-title{font-family:var(--heading-font-family)!important}
h5.icon-box-title,h6.icon-box-title{font-family:"Montserrat",sans-serif!important;text-transform:none;letter-spacing:0}
p,li,.content,.tm-text-editor,.service-details,input,select,textarea{font-family:var(--body-font-family)!important}
.btn,.btn-style2,.btn-style3,.theme-btn,.menuzord-menu>li>a,.breadcrumbs,.sub-title,.tag,.cat-links a,.wpcf7-submit,input[type=submit]{font-family:var(--jj-label)!important;font-weight:700!important;letter-spacing:.06em!important;text-transform:uppercase}
.menuzord-menu>li>a{font-size:16px!important}
::selection{background:var(--jj-rojo);color:#fff}

/* etiquetas chiquitas encima de los títulos: fuera */
.tm-sc-section-title .sub-title-outer,.tm-sc-section-title .subtitle,.sub-title-outer{display:none!important}

/* logo: techo del isotipo + nombre */
.jj-brand{display:inline-flex;align-items:center;gap:12px;line-height:1;color:var(--jj-carbon);text-decoration:none;white-space:nowrap}
.jj-brand img{width:64px!important;height:auto!important;max-height:none!important;flex:none}
.jj-brand__txt{display:flex;flex-direction:column;gap:3px}
.jj-brand__txt b{font-family:"Bebas Neue",sans-serif;font-weight:400;font-size:30px;letter-spacing:.04em;color:inherit}
.jj-brand__txt small{font-family:var(--jj-label);font-weight:700;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:inherit;opacity:.8;border-top:2px solid var(--jj-rojo);padding-top:4px}
.jj-brand--light{color:#fff}
.tm-header-branding .jj-brand img{width:52px!important}
.tm-header-branding .jj-brand__txt b{font-size:25px}

/* submenú de servicios */
.jj-nav .dropdown{min-width:250px}
.jj-nav .dropdown a{font-family:"Montserrat",sans-serif!important;text-transform:none!important;letter-spacing:0!important;font-weight:600!important;font-size:14px!important}

/* scroll suave */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

/* contenido de los artículos y de servicios */
.jj-prose{font-size:17px;line-height:1.75;color:var(--text-color)}
.jj-prose h2{font-size:38px;margin:40px 0 14px;color:var(--jj-carbon)}
.jj-prose h3{font-size:28px;margin:30px 0 10px;color:var(--jj-carbon)}
.jj-prose ul{padding-left:0;list-style:none;margin:0 0 22px}
.jj-prose ul li{position:relative;padding-left:26px;margin-bottom:10px}
.jj-prose ul li:before{content:"";position:absolute;left:0;top:.72em;width:14px;height:3px;background:var(--jj-rojo)}
.jj-prose a{color:var(--jj-rojo);text-decoration:underline;text-underline-offset:3px}
.jj-cta-line{margin-top:34px;padding:26px 28px;background:var(--jj-claro);border-left:5px solid var(--jj-rojo);border-radius:6px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.jj-cta-line p{margin:0;font-weight:600;color:var(--jj-carbon)}
.jj-cta-line .btn{background:var(--jj-rojo);color:#fff!important;border-radius:999px;padding:13px 26px;font-size:15px}

/* foto de entrada de cada artículo */
.jj-post-hero{border-radius:20px;overflow:hidden;margin-bottom:34px;aspect-ratio:16/9}
.jj-post-hero img{width:100%;height:100%;object-fit:cover;display:block}

@media (max-width:767px){
  .jj-brand img{width:50px!important}
  .jj-brand__txt b{font-size:24px}
  .jj-brand__txt small{font-size:10px}
  .jj-prose{font-size:16px}
  .jj-prose h2{font-size:31px}
}

/* hero del inicio: velo oscuro a la izquierda para que el texto se lea sobre la foto */
.elementor-element-5df813f:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
  background:linear-gradient(90deg,rgba(18,21,24,.86) 0%,rgba(18,21,24,.6) 38%,rgba(18,21,24,.08) 72%),linear-gradient(0deg,rgba(18,21,24,.55),rgba(18,21,24,0) 40%)!important;opacity:1!important}
.elementor-element-fead853{z-index:1}
.elementor-element-7a3af04 .title{font-size:clamp(56px,6.6vw,108px)!important;line-height:.92!important}

/* fotos verticales en espacios horizontales: recorte parejo */
.service-block .image img,.elementor-element-f1eee3e img,.blog-item-current-style1 .image img,.post-thumb img{width:100%;aspect-ratio:3/2;object-fit:cover}
.elementor-element-f1eee3e img{aspect-ratio:16/10}
/* preguntas: texto normal, no titular */
.tm-accordion .title,.tm-accordion .title .text{font-family:"Montserrat",sans-serif!important;text-transform:none!important;letter-spacing:0!important;font-weight:600!important;font-size:17px!important;line-height:1.4!important}

/* servicio en el celular: primero el contenido, después la lista lateral */
@media (max-width:1024px){.elementor-element-4a903ba{order:-1}}

/* correos y teléfonos se leen tal cual, no en mayúsculas de titular */
a[href^="mailto"],.icon-box-title a[href^="tel"]{font-family:"Montserrat",sans-serif!important;text-transform:none!important;letter-spacing:0!important;font-weight:600!important;font-size:16px!important}

/* mensaje del formulario al enviar */
.jj-aviso{margin:14px 0 0;font-weight:600;color:var(--jj-carbon)}
.jj-aviso:empty{display:none}

/* obras reales de J&J (inicio) */
.jj-work{background:#fff;padding:110px 0 90px}
.jj-work .container{max-width:1388px;margin:0 auto;padding:0 24px}
.jj-work__head{max-width:720px;margin:0 0 54px}
.jj-work__head .title{font-size:clamp(46px,5.4vw,84px);color:var(--jj-carbon);margin:0 0 14px}
.jj-work__head p{font-size:18px;margin:0}
.jj-work__job{display:grid;grid-template-columns:280px 1fr;gap:40px;padding:36px 0;border-top:1px solid var(--jj-claro)}
.jj-work__txt h3{font-size:34px;color:var(--jj-carbon);margin:0 0 10px}
.jj-work__txt p{margin:0;font-size:16px;line-height:1.6}
.jj-work__grid{display:grid;gap:12px;grid-auto-flow:dense}
.jj-work__grid--3{grid-template-columns:repeat(3,1fr)}
.jj-work__grid--4{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr}
.jj-work__grid--4 .jj-work__ph:first-child{grid-row:span 2}
.jj-work__grid--4 .jj-work__ph:nth-child(4){display:none}
.jj-work__grid--2{grid-template-columns:1fr 1fr}
.jj-work__ph{transition:none;position:relative;display:block;overflow:hidden;border-radius:14px;background:var(--jj-claro);aspect-ratio:3/4}
.jj-work__ph--h{aspect-ratio:3/2}
.jj-work__grid--2 .jj-work__ph:not(.jj-work__ph--h){aspect-ratio:1}
.jj-work__grid--4 .jj-work__ph{aspect-ratio:auto;min-height:170px}
.jj-work__ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
@media (hover:hover) and (pointer:fine){.jj-work__ph:hover img{transform:scale(1.04)}}
.jj-work__ph span{position:absolute;left:12px;top:12px;background:var(--jj-carbon);color:#fff;font-family:var(--jj-label);font-weight:700;font-size:13px;letter-spacing:.1em;text-transform:uppercase;padding:6px 11px;border-radius:999px}
.jj-work__grid--3 .jj-work__ph:last-child span{background:var(--jj-rojo)}

/* foto en grande */
.jj-lb{border:0;padding:0;background:transparent;max-width:none;max-height:none;width:100vw;height:100dvh;margin:0}
.jj-lb::backdrop{background:rgba(18,21,24,.94)}
.jj-lb img{position:absolute;inset:0;margin:auto;max-width:92vw;max-height:86dvh;border-radius:10px}
.jj-lb button{position:absolute;border:0;background:rgba(255,255,255,.12);color:#fff;width:52px;height:52px;border-radius:50%;font-size:34px;line-height:1;cursor:pointer;display:grid;place-items:center}
.jj-lb button:active{transform:scale(.94)}
.jj-lb__x{top:18px;right:18px}
.jj-lb__p{left:18px;top:50%;margin-top:-26px}
.jj-lb__n{right:18px;top:50%;margin-top:-26px}

@media (max-width:991px){
  .jj-work{padding:72px 0 56px}
  .jj-work .container{padding:0 16px}
  .jj-work__head{margin-bottom:28px}
  .jj-work__head p{font-size:16px}
  .jj-work__job{grid-template-columns:1fr;gap:16px;padding:26px 0}
  .jj-work__txt h3{font-size:30px}
  /* en el celular cada obra es una tira que se desliza de lado: no alarga la página */
  .jj-work__grid,.jj-work__grid--3,.jj-work__grid--4,.jj-work__grid--2{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;gap:10px;margin:0 -16px;padding:0 16px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .jj-work__grid::-webkit-scrollbar{display:none}
  .jj-work__ph,.jj-work__grid--4 .jj-work__ph{flex:0 0 66%;scroll-snap-align:start;aspect-ratio:3/4;min-height:0}
  .jj-work__ph--h,.jj-work__grid--4 .jj-work__ph{flex-basis:84%;aspect-ratio:3/2}
  .jj-work__grid--4 .jj-work__ph:nth-child(4){display:block}
  .jj-lb__p,.jj-lb__n{top:auto;bottom:22px;margin:0}
  .jj-lb__p{left:calc(50% - 64px)}.jj-lb__n{right:calc(50% - 64px)}
}