/* Propuesta D · «Formas» (holdens.agency, «movimiento sin vídeo»): gris claro, formas redondeadas y paralelogramos que se mueven,
   menú en cápsula con botón verde, paneles que se deslizan. Host Grotesk + DM Mono. */
body.jg-d {
	--bg: #F1F1EE; --bg2: #E6E6E2; --panel: #FFFFFF; --ink: #0E0E0D; --mute: #5C5C58; --dim: rgba(14, 14, 13, .32);
	--line: rgba(14, 14, 13, .1); --line-2: rgba(14, 14, 13, .2); --acc: #0F5A40; --acc-ink: #FFFFFF; --acc-soft: rgba(15, 90, 64, .15); --gold: #C9AE7C;
	--soft: rgba(14, 14, 13, .06); --row-hover: rgba(14, 14, 13, .03); --hdr-bg: rgba(241, 241, 238, .85); --nav-bg: #E4E4E0; --err: #C0392B;
	--fd: 'Host Grotesk', system-ui, sans-serif; --fb: 'Host Grotesk', system-ui, sans-serif; --fm: 'DM Mono', ui-monospace, monospace;
	--h1s: clamp(60px, 10vw, 170px); --h1w: 500; --h2s: clamp(36px, 4.4vw, 72px); --h2w: 500; --h2ls: -.03em; --somos-w: 400; --enf-w: 400;
	--r-md: 16px; --r-lg: 22px; --r-xl: 30px; --logo-f: grayscale(1) brightness(.25); --logo-o: .7; --logo-f-hover: none;
	--pill-bg: #EADFC8; --pill-ink: #0E0E0D; --ftr-bg: #0E2D22; --ftr-ink: #F1F1EE; --veil-bg: #0F5A40;
	--diag-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E0E0D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E");
}
body.jg-d .jg-hdr__nav .elementor-icon-list-items { border: 0; }
body.jg-d .jg-hdr__cta .elementor-button { background: var(--acc); color: #fff; }
/* Hero: el titular en formas (cada forma es un trozo del propio titular) y bloques grises con flecha */
body.jg-site .e-con.jg-hero--d { min-height: 100svh; justify-content: center; gap: clamp(10px, 1.2vw, 18px); padding-block: 130px 50px; overflow: hidden; }
body.jg-site .e-con.jg-dfila { flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center; gap: clamp(10px, 1.2vw, 18px); width: max-content; align-self: center; will-change: transform; }
body.jg-site .jg-dpill { flex: 0 0 auto; }
body.jg-site .jg-dpill .elementor-heading-title { display: inline-flex; align-items: center; height: clamp(76px, 9.4vw, 168px); padding: 0 clamp(24px, 3vw, 56px); font: 500 clamp(44px, 6.6vw, 120px)/1 var(--fd); letter-spacing: -.045em; white-space: nowrap; transition: background .4s, color .4s, transform .5s var(--ease); }
body.jg-site .jg-dpill--1 .elementor-heading-title { background: var(--acc); color: #fff; border-radius: 999px; }
body.jg-site .jg-dpill--2 .elementor-heading-title { background: var(--ink); color: #fff; border-radius: 26px; clip-path: polygon(7% 0, 100% 0, 93% 100%, 0 100%); padding-inline: clamp(44px, 5vw, 90px); }
body.jg-site .jg-dpill--3 .elementor-heading-title { background: #DCDCD7; color: var(--ink); border-radius: 36px; }
body.jg-site .jg-dpill--4 .elementor-heading-title { background: var(--gold); color: var(--ink); border-radius: 999px; }
body.jg-site .jg-dpill:hover .elementor-heading-title { transform: scale(1.03) rotate(-1deg); }
body.jg-site .e-con.jg-dsh { flex: 0 0 auto; height: clamp(76px, 9.4vw, 168px); background: #E1E1DC; }
body.jg-site .e-con.jg-dsh--flecha-izq { width: 16vw; clip-path: polygon(24% 0, 100% 0, 100% 100%, 24% 100%, 0 50%); }
body.jg-site .e-con.jg-dsh--flecha-der { width: 16vw; clip-path: polygon(0 0, 76% 0, 100% 50%, 76% 100%, 0 100%); }
body.jg-site .e-con.jg-dsh--bloque { width: 10vw; border-radius: 0 999px 999px 0; }
body.jg-site .e-con.jg-dsh--bloque2 { width: 12vw; border-radius: 30px 0 0 30px; }
body.jg-site .e-con.jg-hero--d .jg-hero__pie { flex-direction: row; justify-content: space-between; align-items: center; margin-top: clamp(30px, 4vw, 60px); }
/* Como tú, y la ventana con su foto de la selva */
body.jg-site .e-con.jg-somos--d .jg-somos__in { grid-template-columns: minmax(0, 1.3fr) minmax(240px, .7fr); }
body.jg-site .e-con.jg-ventana { margin-top: clamp(50px, 7vw, 110px); height: clamp(320px, 70vh, 720px); border-radius: var(--r-xl); overflow: hidden; position: relative; }
body.jg-site .jg-ventana__img { position: absolute !important; inset: -12% 0; }
body.jg-site .jg-ventana__img img { width: 100%; height: 100%; object-fit: cover; }
/* Servicios en paneles que se deslizan (sección fijada) */
body.jg-site .e-con.jg-servicios--d { background: #E6E6E2; margin-inline: clamp(8px, 1.4vw, 20px); border-radius: 36px; padding-inline: 0; --sec: clamp(60px, 7vw, 100px); min-height: 100svh; justify-content: center; overflow: hidden; }
body.jg-site .e-con.jg-panel { flex: 0 0 auto; width: clamp(290px, 30vw, 440px); gap: 14px; padding: 18px 18px 24px; border-radius: var(--r-lg); background: var(--panel); scroll-snap-align: start; position: relative; top: 0; transition: top .5s var(--ease), box-shadow .5s; }
body.jg-site .e-con.jg-panel:hover { top: -6px; box-shadow: 0 30px 60px -36px rgba(14, 14, 13, .35); }
body.jg-site .jg-panel__k .elementor-heading-title { font: 500 12px/1 var(--fm); letter-spacing: .12em; color: var(--mute); }
body.jg-site .jg-panel__img { border-radius: 14px; overflow: hidden; }
body.jg-site .jg-panel__img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: scale 1s var(--ease); }
body.jg-site .e-con.jg-panel:hover .jg-panel__img img { scale: 1.05; }
body.jg-site .jg-panel__t .elementor-heading-title { font: 500 clamp(24px, 2vw, 30px)/1.1 var(--fd); letter-spacing: -.02em; }
body.jg-site .jg-panel__d { color: var(--mute); font-size: 15px; }
body.jg-site .jg-panel .jg-btn { margin-top: auto; padding-top: 6px; }
/* Marcas en cápsula, proyectos, enfoque y blog */
body.jg-site .e-con.jg-marcas--d { --sec: clamp(60px, 7vw, 100px); }
body.jg-site .jg-marcas--d .jg-marquee { background: #fff; border-radius: 999px; margin-inline: var(--g); padding-block: 4px; }
/* Subidas del hover con «top»: el transform es de GSAP (entrada e inclinación) y GSAP anula translate en línea */
body.jg-site .jg-proyectos--d .jg-pg { position: relative; top: 0; transition: top .5s var(--ease), box-shadow .5s; }
body.jg-site .jg-proyectos--d .jg-pg:hover { top: -6px; box-shadow: 0 30px 60px -36px rgba(14, 14, 13, .4); }
body.jg-site .e-con.jg-post { background: var(--panel); padding: 12px 12px 22px; border-radius: var(--r-lg); }
body.jg-site .jg-blog--d .jg-post__img { border-radius: 14px; }
body.jg-site .jg-blog--d .jg-post__t { padding-inline: 8px; }
/* Contacto en un gran panel verde */
/* El verde va en literal: este mismo bloque redefine --acc (arena) y var(--acc) daba arena con texto blanco */
body.jg-site .jg-contacto--d .e-con.jg-brief { background: #0F5A40; border-radius: 36px; padding: clamp(30px, 5vw, 80px); max-width: calc(var(--maxw) - 2 * var(--g)); color: #F1F1EE; --ink: #F1F1EE; --mute: rgba(241, 241, 238, .72); --line: rgba(241, 241, 238, .16); --line-2: rgba(241, 241, 238, .3); --panel: rgba(255, 255, 255, .07); --acc: #C9AE7C; --acc-ink: #0E0E0D; --bg: #0E0E0D; }
body.jg-d .jg-ftr__word .elementor-heading-title { font-weight: 600; -webkit-text-stroke-color: rgba(201, 174, 124, .35); }
/* Pie verde oscuro: el acento pasa a arena (el verde del teléfono no se veía) */
body.jg-d .jg-ftr { --acc: #C9AE7C; --acc-ink: #0E0E0D; }
@media (max-width: 760px) { body.jg-site .jg-dsh { display: none; } body.jg-site .e-con.jg-dfila { flex-wrap: wrap; width: 100%; padding-inline: var(--g); justify-content: flex-start; } }