/* =====================================================================
   GMV · Tema de color 2026-11 (vino · rojo · gris plata · negro)
   Capa común para las 11 páginas del borrador. Se carga al final del
   <head> y solo sobrescribe: no reemplaza los estilos de cada página.
   ===================================================================== */
:root{
  --vino:#6E0B24; --vino2:#8E0F31; --rojo:#C00030; --rojo-vivo:#E3173E;
  --negro:#0C0D10; --grafito:#17191F; --acero:#2A2E36;
  --plata:#C3C8CF; --plata-cl:#E6E8EC; --plata-osc:#8E949E;
  --g-vino:linear-gradient(135deg,#4E0718 0%,#7A0C28 45%,#A8113A 100%);
  --g-plata:linear-gradient(180deg,#F3F4F6 0%,#E3E6EA 100%);
  --g-negro:radial-gradient(120% 140% at 85% 0%,rgba(142,15,49,.38) 0%,rgba(142,15,49,0) 46%),linear-gradient(180deg,#121318 0%,#0A0B0E 100%);
}

/* ---------- Tipografía y ortografía ---------- */
/* Sin partición de palabras: ninguna palabra se corta con guion al final de línea */
*, p, li, .dsc, .lead, .sub, .justif{ -webkit-hyphens:none !important; hyphens:none !important }
section p:not([class]), .dsc, p.justif{ text-align:justify; text-justify:inter-word }
@media (max-width:760px){ section p:not([class]), .dsc, p.justif{ text-align:left } }
/* Tamaños de párrafo consistentes en todo el sitio */
section p, .dsc, .lead, .sub, .tx p, li span{ font-size:16px; line-height:1.75 }
.lead{ font-size:17px }
@media (max-width:760px){ section p, .dsc, .lead, .sub, .tx p, li span{ font-size:15.5px } }
h2 em, h1 em{ color:var(--rojo); font-style:italic }

/* ---------- Barra superior y botones ---------- */
.prog{ background:linear-gradient(90deg,var(--vino),var(--rojo-vivo)) }
body:before{ content:""; position:fixed; z-index:130; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg,var(--vino) 0%,var(--rojo) 55%,var(--plata) 100%) }
.btn-p, .btn-d{ background:linear-gradient(135deg,var(--vino2),var(--rojo)) !important;
  box-shadow:0 6px 18px rgba(110,11,36,.32) !important }
.pill{ background:rgba(110,11,36,.09); color:var(--vino2) }

/* ---------- Portadas de las páginas internas: grafito + vino ---------- */
.sob-hero, .srv-hero, .com-hero, .lin-hero, .phero{ background:var(--negro) !important }
.sob-hero .ph, .srv-hero .ph, .com-hero .ph, .lin-hero .ph{ opacity:.5 !important; width:62% !important }
.sob-hero .ph:after, .srv-hero .ph:after, .com-hero .ph:after, .lin-hero .ph:after{
  background:linear-gradient(90deg,#0C0D10 0%,rgba(12,13,16,.88) 30%,rgba(110,11,36,.35) 70%,rgba(12,13,16,.2) 100%) !important }
.phero .velo{ background:linear-gradient(100deg,#0C0D10 0%,rgba(12,13,16,.9) 34%,rgba(78,7,24,.55) 62%,rgba(12,13,16,.15) 100%) !important }
.sob-hero h1, .srv-hero h1, .com-hero h1, .lin-hero h1, .phero h1{ color:#fff !important }
.sob-hero .lead, .srv-hero .lead, .com-hero .lead, .lin-hero .lead, .phero .lead{ color:#C9CDD4 !important }
.sob-hero .pill, .srv-hero .pill, .com-hero .pill, .lin-hero .pill, .phero .pill{ background:rgba(255,255,255,.1); color:#fff }
.phero .migas, .phero .migas a, .srv-hero .migas, .srv-hero .migas a{ color:#AEB3BC !important }
.phero .migas b{ color:#fff }
.sob-hero:after, .srv-hero:after, .com-hero:after, .lin-hero:after, .phero:after, .not-hero:after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:6px; z-index:4;
  background:linear-gradient(90deg,var(--vino) 0%,var(--rojo) 50%,var(--plata) 100%) }
.srv-hero .tabs a, .srv-hero nav a{ color:#E4E6EA }
/* Portada del inicio: se mantiene clara y se le suma un corte diagonal vino */
.hero{ position:relative }
.hero:before{ content:""; position:absolute; left:-6%; bottom:-110px; width:52%; height:190px; z-index:1;
  background:var(--g-vino); transform:skewY(-6deg); opacity:.92; pointer-events:none }
.hero .wrap{ position:relative; z-index:3 }

/* ---------- Bandas de color por sección ---------- */
.t-negro{ background:var(--g-negro) !important; color:#C7CBD2; position:relative }
.t-vino{ background:var(--g-vino) !important; color:#F1E3E7; position:relative }
.t-plata{ background:var(--g-plata) !important; border-top:1px solid #D5D9DE; border-bottom:1px solid #D5D9DE }
.t-negro > .wrap > h2, .t-negro > .wrap > .rv > h2, .t-negro .vrow h2, .t-negro .t-cab h2,
.t-vino > .wrap > h2, .t-vino > .wrap > .rv > h2, .t-vino .vrow h2, .t-vino .t-cab h2{ color:#fff }
.t-negro > .wrap > .lead, .t-negro > .wrap > .rv > .lead, .t-negro .vrow .sub, .t-negro .t-cab p,
.t-vino > .wrap > .lead, .t-vino > .wrap > .rv > .lead, .t-vino .vrow .sub, .t-vino .t-cab p{ color:#D3D6DC !important }
.t-negro > .wrap > .pill, .t-negro > .wrap > .rv > .pill, .t-negro .vrow .pill, .t-negro .t-cab .pill{ background:rgba(195,200,207,.14); color:#E6E8EC }
.t-vino > .wrap > .pill, .t-vino > .wrap > .rv > .pill, .t-vino .vrow .pill, .t-vino .t-cab .pill{ background:rgba(255,255,255,.14); color:#fff }
.t-negro h2 em, .t-vino h2 em{ color:var(--plata) }
.t-negro .pais-h .nm, .t-negro .acr .ti{ color:#fff }
.t-negro:before, .t-vino:before{ content:""; position:absolute; top:0; right:0; width:38%; height:5px;
  background:linear-gradient(90deg,transparent,var(--plata)) }
/* Cifras del inicio sobre negro */
.franja-cifras.t-negro{ border:0 }
.franja-cifras.t-negro *{ color:inherit }
.franja-cifras.t-negro strong, .franja-cifras.t-negro b, .franja-cifras.t-negro .n{ color:#fff !important }
.franja-cifras.t-negro .cfd{ background:rgba(255,255,255,.05) !important; border:1px solid rgba(195,200,207,.18) !important;
  box-shadow:none !important; backdrop-filter:none !important; border-radius:20px; padding:16px 8px 14px !important }
.franja-cifras.t-negro .cfd .t{ color:#AEB3BC !important }
.franja-cifras.t-negro .ci{ background:rgba(192,0,48,.22) !important }
.franja-cifras.t-negro .ci svg{ stroke:#F3C7D2 !important }
footer{ background:linear-gradient(180deg,#121318,#08090B) !important; border-top:5px solid var(--vino2) }

/* ---------- Componentes nuevos ---------- */
.t-cab{ max-width:760px }
.t-cab h2{ margin-top:18px; max-width:22ch }
.t-cab p{ margin-top:16px; color:var(--gris) }
.gal2{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-top:42px }
.gal2 figure{ position:relative; margin:0; border-radius:16px; overflow:hidden; aspect-ratio:4/3;
  background:#1d1f25; cursor:zoom-in; box-shadow:0 10px 30px rgba(0,0,0,.18) }
.gal2 figure.big{ grid-column:span 2; grid-row:span 2; aspect-ratio:auto }
.gal2 img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform 600ms var(--out) }
.gal2 figcaption{ position:absolute; left:0; right:0; bottom:0; padding:28px 14px 11px; font-size:12.5px; font-weight:700;
  color:#fff; background:linear-gradient(180deg,transparent,rgba(0,0,0,.72)) }
@media (hover:hover){ .gal2 figure:hover img{ transform:scale(1.05) } }
@media (max-width:900px){ .gal2{ grid-template-columns:repeat(2,1fr) } .gal2 figure.big{ grid-row:span 1 } }

.logos{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:16px; margin-top:42px }
.logo-card{ background:#fff; border:1px solid #E2E5EA; border-radius:20px; padding:22px 22px 20px;
  display:flex; flex-direction:column; gap:12px; box-shadow:0 8px 24px rgba(12,13,16,.06) }
.logo-card .lg{ height:92px; display:flex; align-items:center; justify-content:center; border-radius:14px;
  background:#F6F7F9; padding:12px 16px }
.logo-card .lg.osc{ background:linear-gradient(135deg,#1B1D23,#0C0D10) }
.logo-card .lg img{ max-height:68px; max-width:100%; width:auto; object-fit:contain }
.logo-card .lg .mono{ font-weight:800; font-size:26px; letter-spacing:-.03em; color:var(--vino2) }
.logo-card .lg .mono small{ display:block; font-size:10.5px; letter-spacing:.12em; color:var(--plata-osc); text-transform:uppercase; font-weight:700; margin-top:3px }
.logo-card h4{ font-size:15px; line-height:1.3; color:var(--tinta) }
.logo-card p{ font-size:14px !important; color:var(--gris); line-height:1.55 !important; margin:0 }
.logo-card .tag{ align-self:flex-start; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
  color:#fff; background:linear-gradient(135deg,var(--vino2),var(--rojo)); padding:4px 10px; border-radius:100px }

.franja-logos{ padding:46px 0 }
.franja-logos .ti{ text-align:center; font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:800; color:var(--plata) }
.franja-logos .fila{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:14px; margin-top:22px }
.franja-logos .fila span{ background:#fff; border-radius:14px; height:74px; min-width:150px; padding:10px 18px;
  display:flex; align-items:center; justify-content:center }
.franja-logos .fila span.osc{ background:#22252C }
.franja-logos img{ max-height:52px; max-width:170px; width:auto }

.vids{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:42px }
.vid{ background:#fff; border-radius:18px; overflow:hidden; border:1px solid #E2E5EA; box-shadow:0 8px 24px rgba(12,13,16,.07) }
.vid .yt{ position:relative; aspect-ratio:16/9; background:#000 center/cover no-repeat; cursor:pointer; display:block; width:100%; border:0; padding:0 }
.vid .yt:after{ content:""; position:absolute; left:50%; top:50%; width:62px; height:44px; margin:-22px 0 0 -31px; border-radius:12px;
  background:var(--rojo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M8 5v14l11-7z'/%3E%3C/svg%3E") center/26px no-repeat;
  box-shadow:0 6px 18px rgba(0,0,0,.4); transition:transform 200ms ease }
.vid .yt:hover:after{ transform:scale(1.08) }
.vid iframe{ width:100%; aspect-ratio:16/9; border:0; display:block }
.vid .vt{ padding:14px 16px 16px; font-size:14px; font-weight:700; line-height:1.35; color:var(--tinta) }
.vid .vt small{ display:block; font-weight:600; color:var(--suave); font-size:12px; margin-top:4px }
@media (max-width:1000px){ .vids{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:560px){ .vids{ grid-template-columns:1fr } .gal2{ grid-template-columns:1fr 1fr } }

.hito-foto{ float:right; width:240px; margin:4px 0 16px 28px; border-radius:16px; overflow:hidden; box-shadow:0 10px 26px rgba(12,13,16,.14); cursor:zoom-in }
.hito-foto img{ display:block; width:100%; aspect-ratio:4/5; object-fit:cover }
.hito-b:after{ content:""; display:block; clear:both }
@media (max-width:760px){ .hito-foto{ float:none; width:100%; max-width:340px; margin:14px 0 } }

.certs2{ display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:14px; margin-top:16px }
.certs2 figure{ margin:0; background:#fff; border:1px solid #E2E5EA; border-radius:14px; padding:10px; cursor:zoom-in;
  box-shadow:0 6px 18px rgba(12,13,16,.06); transition:transform 220ms var(--out),box-shadow 220ms ease }
.certs2 figure:hover{ transform:translateY(-3px); box-shadow:0 14px 30px rgba(12,13,16,.12) }
.certs2 img{ width:100%; aspect-ratio:3/4; object-fit:cover; object-position:top; border-radius:8px; display:block; background:#f3f3f3 }
.certs2 figcaption{ font-size:12.5px; font-weight:700; margin-top:9px; line-height:1.3; color:var(--tinta) }
.certs2 figcaption small{ display:block; color:var(--suave); font-weight:600; margin-top:2px }

.temas{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-top:42px }
.tema{ background:#fff; border:1px solid #E2E5EA; border-radius:22px; padding:28px 28px 24px; box-shadow:0 8px 24px rgba(12,13,16,.05);
  border-top:5px solid var(--vino2) }
.tema h3{ font-size:20px; color:var(--tinta) }
.tema .st{ margin-top:18px; padding-top:16px; border-top:1px solid #ECEEF1 }
.tema .st:first-of-type{ border-top:0; padding-top:0 }
.tema h4{ font-size:15px; color:var(--vino2); line-height:1.35 }
.tema p{ font-size:15px !important; color:var(--gris); margin-top:7px; line-height:1.7 !important }
.tema ul{ margin:8px 0 0 18px; color:var(--gris); font-size:15px; line-height:1.7 }
.tema ul li{ margin-top:6px }
@media (max-width:860px){ .temas{ grid-template-columns:1fr } }

.evs{ display:grid; gap:22px; margin-top:42px }
.ev{ display:grid; grid-template-columns:1.05fr 1fr; gap:26px; align-items:center; background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1); border-radius:24px; padding:18px }
.ev:nth-child(even){ grid-template-columns:1fr 1.05fr }
.ev:nth-child(even) .ev-f{ order:2 }
.ev-f{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px }
.ev-f figure{ margin:0; border-radius:12px; overflow:hidden; aspect-ratio:4/3; cursor:zoom-in }
.ev-f figure:first-child{ grid-column:span 3; aspect-ratio:16/9 }
.ev-f img{ width:100%; height:100%; object-fit:cover; display:block }
.ev-t .n{ font-size:12px; font-weight:800; letter-spacing:.14em; color:var(--plata); text-transform:uppercase }
.ev-t h3{ color:#fff; font-size:21px; margin-top:8px }
.ev-t p{ color:#C9CDD4 !important; margin-top:10px }
@media (max-width:860px){ .ev, .ev:nth-child(even){ grid-template-columns:1fr } .ev:nth-child(even) .ev-f{ order:0 } }

.portafolio{ display:flex; gap:22px; align-items:center; justify-content:space-between; flex-wrap:wrap;
  background:var(--g-vino); color:#fff; border-radius:24px; padding:30px 34px; margin-bottom:40px; box-shadow:0 14px 40px rgba(110,11,36,.3) }
.portafolio h2{ color:#fff; font-size:clamp(22px,2.4vw,30px); margin:6px 0 0; max-width:none }
.portafolio p{ color:#F1DDE3 !important; margin-top:8px; max-width:60ch }
.portafolio .k{ font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#F3C7D2 }
.portafolio a{ background:#fff; color:var(--vino2); font-weight:800; text-decoration:none; padding:14px 24px; border-radius:100px;
  display:inline-flex; gap:10px; align-items:center; white-space:nowrap }

.familia{ display:grid; grid-template-columns:1fr 1.1fr; gap:34px; align-items:center; margin-top:42px }
.familia .fg{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px }
.familia .fg figure{ margin:0; border-radius:12px; overflow:hidden; aspect-ratio:1; cursor:zoom-in }
.familia .fg img{ width:100%; height:100%; object-fit:cover; display:block }
@media (max-width:860px){ .familia{ grid-template-columns:1fr } }

/* Logos dentro de tarjetas existentes */
.firma .lg-firma{ height:70px; width:auto; max-width:180px; object-fit:contain; display:block; margin-bottom:6px }
.esp .lg-gmv{ height:58px; width:auto; display:block; margin-bottom:4px }
.vmv .lg-gmv{ height:34px; width:auto; display:block; margin-bottom:10px }
.acrs .acr .lg{ height:64px; display:flex; align-items:center; margin-bottom:10px }
.acrs .acr .lg img{ max-height:60px; max-width:190px; width:auto; object-fit:contain }
.acrs .acr .lg.osc{ background:#1B1D23; border-radius:10px; padding:8px 12px; display:inline-flex }

/* Visor de imágenes común */
.lbx{ position:fixed; inset:0; z-index:400; background:rgba(8,9,11,.92); display:none; align-items:center; justify-content:center; padding:4vh 4vw }
.lbx.on{ display:flex }
.lbx img{ max-width:100%; max-height:84vh; border-radius:10px; box-shadow:0 20px 60px rgba(0,0,0,.5) }
.lbx .c{ position:absolute; left:0; right:0; bottom:3vh; text-align:center; color:#E6E8EC; font-size:14px; font-weight:600 }
.lbx button{ position:absolute; background:rgba(255,255,255,.1); border:0; color:#fff; width:48px; height:48px; border-radius:50%; font-size:26px; cursor:pointer }
.lbx .x{ top:3vh; right:3vw } .lbx .p{ left:2vw; top:50% } .lbx .n{ right:2vw; top:50% }

/* Ajustes de legibilidad */
img[src$=".svg"]{ width:auto }
.acrs .acr .lg.osc img, .franja-logos .fila span.osc img{ width:150px; height:auto }
.logo-card p{ text-align:left !important }
:is(.t-negro,.t-vino) :is(article,.al,.firma,.cert,.acr):not(.ev) :is(h3,h4){ color:var(--tinta) }
:is(.t-negro,.t-vino) :is(article,.al,.firma,.acr):not(.ev){ color:var(--tinta) }
:is(.t-negro,.t-vino) :is(article,.al,.firma,.acr):not(.ev) p{ color:var(--gris) }
.logo-card .lg .mono.sri{ color:#1F4FA0 }

/* ---- Ajustes moviles 6-nov-2026 ---- */
.gal2{ grid-auto-flow:dense }
.gal2 figure.ancho{ grid-column:span 2; aspect-ratio:8/3 }
.ev-f figure:last-child:nth-child(3n+2){ grid-column:span 3; aspect-ratio:16/9 }
@media (max-width:900px){ .gal2 figure.solo{ grid-column:span 2; aspect-ratio:16/9 } }
@media (max-width:760px){
  input, select, textarea{ font-size:16px !important }
  footer .fgrid{ padding-top:0 !important }
}
@media (max-width:560px){
  .certs2{ grid-template-columns:1fr 1fr; gap:10px }
  .certs2 figcaption{ font-size:12px }
  .acrs{ gap:12px !important }
  .acrs .acr{ display:grid; grid-template-columns:96px 1fr; column-gap:14px; align-items:center; padding:16px !important }
  .acrs .acr .lg{ grid-row:1 / span 2; height:auto; margin:0; justify-content:center }
  .acrs .acr .lg img{ max-width:96px; max-height:58px }
  .acrs .acr .lg.osc{ padding:6px 8px }
  .acrs .acr .lg.osc img{ width:80px }
  .acrs .acr h4{ margin:0 0 4px !important; font-size:14.5px !important; align-self:end }
  .acrs .acr p{ margin:0; font-size:13px !important; line-height:1.5 !important; align-self:start }
  .gal2{ gap:8px }
  .gal2 figcaption{ font-size:11.5px; padding:22px 10px 8px; line-height:1.25 }
}

/* ── GMV · capa común de animación de contenido (11-11-2026) ──
   Solo actúa si el JS marcó <html class="gmv-a">; sin JS todo se ve normal. */
:root{--a-out:cubic-bezier(.23,1,.32,1)}
@media (prefers-reduced-motion:no-preference){
  /* textos, tarjetas y bloques: suben y aparecen */
  html.gmv-a .a-up{transition:opacity 760ms var(--a-out),transform 760ms var(--a-out);transition-delay:var(--ad,0ms)}
  html.gmv-a .a-up:not(.a-in){opacity:0;transform:translateY(26px)}

  /* desde los lados (columnas de dos) */
  html.gmv-a .a-izq{transition:opacity 820ms var(--a-out),transform 820ms var(--a-out);transition-delay:var(--ad,0ms)}
  html.gmv-a .a-izq:not(.a-in){opacity:0;transform:translateX(-34px)}
  html.gmv-a .a-der{transition:opacity 820ms var(--a-out),transform 820ms var(--a-out);transition-delay:var(--ad,0ms)}
  html.gmv-a .a-der:not(.a-in){opacity:0;transform:translateX(34px)}

  /* fotos y videos: se abren como una ventana */
  html.gmv-a .a-zoom{transition:opacity 900ms var(--a-out),transform 900ms var(--a-out),clip-path 1000ms var(--a-out);transition-delay:var(--ad,0ms)}
  html.gmv-a .a-zoom:not(.a-in){opacity:0;transform:scale(.94);clip-path:inset(10% 10% 10% 10% round 16px)}

  /* encabezados de las páginas internas (la clase gmv-a la pone el <head>) */
  html.gmv-a :is(.com-hero,.lin-hero,.not-hero,.pol-hero,.art-hero,.sob-hero) .wrap > *{transition:opacity 900ms var(--a-out),transform 900ms var(--a-out)}
  html.gmv-a :is(.com-hero,.lin-hero,.not-hero,.pol-hero,.art-hero,.sob-hero) .wrap > *:not(.a-in){opacity:0;transform:translateY(30px)}
  html.gmv-a :is(.com-hero,.lin-hero,.not-hero,.pol-hero,.art-hero,.sob-hero) .wrap > *:nth-child(2){transition-delay:140ms}
  html.gmv-a :is(.com-hero,.lin-hero,.not-hero,.pol-hero,.art-hero,.sob-hero) .wrap > *:nth-child(3){transition-delay:280ms}
  html.gmv-a :is(.com-hero,.lin-hero,.not-hero,.pol-hero,.art-hero,.sob-hero) .wrap > *:nth-child(n+4){transition-delay:420ms}
  html.gmv-a :is(.com-hero,.lin-hero,.not-hero,.pol-hero,.art-hero,.sob-hero) > .ph{transition:transform 2400ms var(--a-out),opacity 1400ms ease}
  html.gmv-a :is(.com-hero,.lin-hero,.not-hero,.pol-hero,.art-hero,.sob-hero) > .ph:not(.a-in){transform:scale(1.1);opacity:.35}

}

/* respuesta al presionar */
a.btn-g:active,a.btn-p:active,a.btn-d:active,.nv nav a:active{transform:scale(.97)}