/* =========================================================
   Plantillas generadas · 12 estructuras parametrizadas
   Lenguaje «estudio Framer»: titulares grandes y apretados, botones en
   píldora con flecha, tarjetas flotantes de vidrio, fila de metadatos,
   numeración 01·02·03, fotos con grano y radios suaves.
   Variables: --g-fd/--g-fb (tipografías), --g-tw (peso), --g-ls, --g-tt, --g-ts (escala)
   --g-bg, --g-sur, --g-ink, --g-mut, --g-acc, --g-on, --g-line (paleta)
   ========================================================= */
.gen{background:var(--g-bg);color:var(--g-ink);font-family:var(--g-fb);-webkit-font-smoothing:antialiased}
.gen .bar{background:color-mix(in srgb,var(--g-ink) 7%,transparent)}
.gen .vp{display:flex;flex-direction:column}

/* ---------- navegación ---------- */
.gn{display:flex;align-items:center;gap:2.6cqw;padding:2.2cqw 3.6cqw;font:500 1.15cqw/1 var(--g-fb);position:relative;z-index:4;flex:none}
.gn b{font-family:var(--g-fd);font-weight:var(--g-tw);font-size:1.9cqw;letter-spacing:var(--g-ls);text-transform:var(--g-tt);line-height:1;white-space:nowrap}
.gn-l{display:flex;gap:2.4cqw;margin-inline:auto;opacity:.78}
.gn-c{background:var(--g-ink);color:var(--g-bg);padding:.95cqw 1.6cqw;border-radius:9cqw;font:600 1.05cqw/1 var(--g-fb);white-space:nowrap}
.gn.on{color:#fff}
.gn.on .gn-c{background:rgba(255,255,255,.16);color:#fff;backdrop-filter:blur(.8cqw);box-shadow:inset 0 0 0 .1cqw rgba(255,255,255,.28)}

/* ---------- piezas de texto ---------- */
.gen .gt{font-family:var(--g-fd);font-weight:var(--g-tw);letter-spacing:calc(var(--g-ls) - .02em);text-transform:var(--g-tt);
  font-size:calc(var(--g-ts) * 6.4cqw);line-height:.94;text-wrap:balance;margin:0}
.gen .gk{display:flex;align-items:center;gap:.8cqw;font:600 .95cqw/1.2 var(--g-fb);letter-spacing:.14em;text-transform:uppercase;color:var(--g-mut);margin:0 0 1.8cqw!important}
.gen .gk i{width:.75cqw;height:.75cqw;border-radius:50%;background:var(--g-acc);flex:none;box-shadow:0 0 0 .35cqw color-mix(in srgb,var(--g-acc) 22%,transparent)}
.gen .gk.on{color:rgba(255,255,255,.82)}
.gen .gs{font:400 1.3cqw/1.5 var(--g-fb);color:var(--g-mut);margin-top:1.8cqw!important;max-width:34cqw;text-wrap:pretty}
.gen .gpill{display:inline-flex;align-items:center;gap:.8cqw;font:600 .95cqw/1 var(--g-fb);letter-spacing:.12em;text-transform:uppercase;padding:.9cqw 1.5cqw;border-radius:9cqw;
  background:rgba(255,255,255,.12);backdrop-filter:blur(.8cqw);box-shadow:inset 0 0 0 .1cqw rgba(255,255,255,.25);margin-bottom:2.2cqw!important}

/* ---------- botones ---------- */
.gbtns{display:flex;align-items:center;gap:1cqw;margin-top:2.4cqw}
.gc{display:inline-flex;align-items:center;gap:1.1cqw;margin-top:2.4cqw;background:var(--g-acc);color:var(--g-on);font:600 1.15cqw/1 var(--g-fb);
  padding:.55cqw .55cqw .55cqw 1.9cqw;border-radius:9cqw;white-space:nowrap;box-shadow:0 1.2cqw 2.4cqw -1.2cqw color-mix(in srgb,var(--g-acc) 70%,transparent)}
.gc i{display:grid;place-items:center;width:2.7cqw;height:2.7cqw;border-radius:50%;background:var(--g-on);color:var(--g-acc);font-style:normal;font-size:1.25cqw}
.gbtns .gc{margin-top:0}
.gc2{background:transparent;color:inherit;box-shadow:inset 0 0 0 .12cqw currentColor;padding:1.33cqw 1.9cqw;opacity:.9}

/* ---------- fotos ---------- */
.gp{position:relative;overflow:hidden;background:var(--g-sur);border-radius:1cqw}
.gp>i{position:absolute;inset:0;background:center/cover no-repeat}
.gp>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gp::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E")}
.gp.full{position:absolute;inset:0;border-radius:0}
.gin{display:inline-block;width:1.6em;height:.78em;border-radius:9cqw;background:center/cover no-repeat;vertical-align:-.04em;margin:0 -.08em;box-shadow:inset 0 0 0 .1cqw rgba(0,0,0,.08)}

/* ---------- tarjeta flotante de vidrio ---------- */
.gcard{position:absolute;z-index:3;display:flex;align-items:center;gap:1cqw;padding:.8cqw 1.4cqw .8cqw .8cqw;border-radius:1.4cqw;
  background:color-mix(in srgb,var(--g-bg) 82%,transparent);backdrop-filter:blur(1.2cqw);color:var(--g-ink);
  box-shadow:0 2cqw 4cqw -1.6cqw rgba(0,0,0,.45),inset 0 0 0 .1cqw color-mix(in srgb,var(--g-ink) 10%,transparent)}
.gcard>i{width:3.6cqw;height:3.6cqw;border-radius:.8cqw;background:center/cover no-repeat;flex:none}
.gcard span{display:grid;gap:.45cqw}
.gcard small{font:500 .95cqw/1 var(--g-fb);color:var(--g-mut)}
.gcard b{font:700 1.35cqw/1 var(--g-fb)}
.gcard em{width:1.9cqw;height:1.9cqw;border-radius:50%;margin-left:.8cqw;background:var(--g-acc);}
.gcard em::after{content:"";display:block;width:100%;height:100%;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10.5l2.6 2.6L14.5 7' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/70% no-repeat}

/* ---------- metadatos, listas, cinta ---------- */
.gm{display:flex;justify-content:space-between;gap:2cqw;font:500 .95cqw/1 var(--g-fb);letter-spacing:.12em;text-transform:uppercase;color:var(--g-mut)}
.gm.on{color:rgba(255,255,255,.7)}
.gl{margin-top:2.2cqw;width:100%}
.gl div{display:grid;grid-template-columns:2.6cqw 1fr auto;align-items:baseline;gap:1cqw;padding:1.05cqw 0;border-top:.1cqw solid var(--g-line);font:400 1.25cqw/1.2 var(--g-fb)}
.gl div:last-child{border-bottom:.1cqw solid var(--g-line)}
.gl em{font-style:normal;font-size:.9cqw;color:var(--g-mut);font-variant-numeric:tabular-nums}
.gl div span:last-child{font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
.gshade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.5) 0,rgba(0,0,0,0) 26%,rgba(0,0,0,0) 45%,rgba(0,0,0,.78) 100%),
  radial-gradient(120% 80% at 0% 100%,rgba(0,0,0,.45),transparent 60%)}
.gshade.dark{background:radial-gradient(90% 70% at 50% 50%,rgba(0,0,0,.35),rgba(0,0,0,.68)),linear-gradient(180deg,rgba(0,0,0,.4),transparent 30%)}
.gtick{position:absolute;left:0;right:0;bottom:0;z-index:4;overflow:hidden;white-space:nowrap;background:var(--g-acc);color:var(--g-on);
  font:500 1.15cqw/1 var(--g-fb);padding:1.15cqw 0}
.gtick div{display:inline-block;padding-left:3.6cqw}
.gtick b{font-weight:700;margin-left:.5cqw}
.gtick i{font-style:normal;margin:0 1.6cqw;opacity:.7}
.g-anim .gtick div{animation:mk-tick 26s linear infinite}
.g-anim .gp>i{animation:mk-kb 16s ease-in-out infinite alternate}
.g-anim .gbadge text{animation:none}
.g-anim .gbadge{animation:g-spin 18s linear infinite}
@keyframes g-spin{to{rotate:360deg}}

/* 1 · portada */
.gl-portada .g-pt{position:absolute;z-index:2;left:3.6cqw;right:3.6cqw;bottom:8.6cqw;display:grid;grid-template-columns:1.6fr 1fr;gap:5cqw;align-items:end;color:#fff}
.gl-portada .gt{font-size:calc(var(--g-ts) * 7.6cqw)}
.gl-portada .gk{color:rgba(255,255,255,.82)}
.gl-portada .gs{color:rgba(255,255,255,.82);margin-top:0!important}
.gl-portada .gc2{color:#fff}
.g-pt-m{position:absolute;z-index:2;left:3.6cqw;right:3.6cqw;bottom:3cqw;padding-top:1.6cqw;border-top:.1cqw solid rgba(255,255,255,.22)}
.gl-portada:not(.g-anim) .g-pt{bottom:8.4cqw}
.gl-portada.g-anim .g-pt{bottom:7.4cqw}

/* 2 · dividida */
.g-sp{flex:1;display:grid;grid-template-columns:1.05fr 1fr;gap:3cqw;min-height:0;padding:0 1.6cqw 1.6cqw 3.6cqw}
.g-sp-t{padding-top:3.4cqw;display:flex;flex-direction:column;align-items:flex-start}
.g-sp-t .gt{font-size:calc(var(--g-ts) * 6cqw)}
.g-stats{margin-top:auto;width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:1.6cqw;padding:1.6cqw 0 2cqw;border-top:.1cqw solid var(--g-line)}
.g-stats div{display:grid;gap:.6cqw}
.g-stats b{font-family:var(--g-fd);font-weight:var(--g-tw);font-size:2.2cqw;letter-spacing:var(--g-ls);line-height:1}
.g-stats span{font-size:1cqw;color:var(--g-mut)}
.g-sp-r{position:relative;min-height:0;display:flex}
.g-sp-p{flex:1;border-radius:1.4cqw}
.g-sp-card{left:-3cqw;top:5cqw}

/* 3 · editorial */
.g-ed{padding:1.6cqw 3.6cqw 2.2cqw;display:grid;grid-template-columns:1fr auto;column-gap:4cqw;align-items:end}
.g-ed .gk{grid-column:1/-1}
.g-ed .gt{font-size:calc(var(--g-ts) * 7.2cqw);max-width:62cqw}
.g-ed-r{display:grid;justify-items:start;max-width:26cqw}
.g-ed-r .gs{margin-top:0!important}
.g-ed-w{flex:1;position:relative;margin:0 1.6cqw 1.6cqw;min-height:0;display:flex}
.g-ed-p{flex:1;border-radius:1.4cqw}
.g-ed-c{position:absolute;z-index:2;left:2cqw;bottom:2cqw;display:flex;gap:.8cqw}
.g-ed-c span{display:flex;gap:.7cqw;align-items:center;font:500 1.05cqw/1 var(--g-fb);padding:.9cqw 1.3cqw;border-radius:9cqw;color:#fff;
  background:rgba(20,20,20,.38);backdrop-filter:blur(1cqw);box-shadow:inset 0 0 0 .1cqw rgba(255,255,255,.2)}
.g-ed-c em{font-style:normal;opacity:.6;font-size:.9cqw}

/* 4 · carta */
.g-ca{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:4cqw;padding:1.2cqw 1.6cqw 1.6cqw 3.6cqw;min-height:0}
.g-ca-l{display:flex;flex-direction:column;align-items:flex-start;padding-top:1.4cqw}
.g-ca-l .gt{font-size:calc(var(--g-ts) * 5.4cqw)}
.g-ca-r{position:relative;display:flex;min-height:0}
.g-ca-p{flex:1;border-radius:1.4cqw}
.g-ca-card{right:2cqw;top:2cqw}
.gl-carta.g-anim .g-ca{padding-bottom:5.6cqw}

/* 5 · centrada */
.g-ce{position:absolute;z-index:2;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2cqw 10cqw 4cqw;color:#fff}
.g-ce .gt{font-size:calc(var(--g-ts) * 8.4cqw);max-width:78cqw}
.g-ce .gs{color:rgba(255,255,255,.82);max-width:44cqw}
.g-ce .gc2{color:#fff}
.g-ce-m{position:absolute;z-index:2;left:3.6cqw;right:3.6cqw;bottom:2.8cqw}

/* 6 · galería */
.g-ga-h{display:grid;grid-template-columns:1fr auto;gap:4cqw;align-items:end;padding:1.4cqw 3.6cqw 2.4cqw}
.g-ga-h .gt{font-size:calc(var(--g-ts) * 5.4cqw);max-width:50cqw}
.g-ga-hr{display:grid;justify-items:start;max-width:24cqw}
.g-ga-hr .gs{margin-top:0!important}
.g-ga-hr .gc{margin-top:1.6cqw}
.g-ga{flex:1;display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:1.2cqw;padding:0 1.6cqw 1.6cqw;min-height:0;align-items:end}
.g-ga figure{margin:0;display:flex;flex-direction:column;min-height:0;height:100%}
.g-ga figure.f1{height:84%}
.g-ga figure.f2{height:92%}
.g-ga .gp{flex:1;border-radius:1.2cqw}
.g-ga figcaption{display:flex;justify-content:space-between;gap:1cqw;padding:1cqw .4cqw 0;font:500 1.1cqw/1.2 var(--g-fb)}
.g-ga figcaption em{font-style:normal;color:var(--g-mut);margin-right:.8cqw;font-size:.9cqw}
.g-ga figcaption span:last-child{color:var(--g-mut)}

/* 7 · revista */
.g-re-m{display:flex;justify-content:space-between;align-items:center;gap:2cqw;padding:1.8cqw 3.6cqw 0;font:600 .95cqw/1 var(--g-fb);letter-spacing:.12em;text-transform:uppercase;color:var(--g-mut)}
.g-re-m .gn-c{letter-spacing:0;text-transform:none}
.g-re-b{font-family:var(--g-fd);font-weight:var(--g-tw);text-transform:var(--g-tt);letter-spacing:calc(var(--g-ls) - .03em);
  font-size:calc(var(--g-ts) * 10cqw);line-height:.86;padding:1.2cqw 3cqw 1.6cqw;white-space:nowrap;overflow:hidden;text-overflow:clip;border-bottom:.12cqw solid var(--g-ink)}
.g-re{flex:1;display:grid;grid-template-columns:1.8fr 1fr;gap:2.6cqw;padding:1.8cqw 1.6cqw 1.6cqw 1.6cqw;min-height:0}
.g-re figure{margin:0;position:relative;display:flex;min-height:0}
.g-re figure .gp{flex:1;border-radius:1.2cqw}
.g-re figcaption{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:5cqw 2.4cqw 2.2cqw;border-radius:0 0 1.2cqw 1.2cqw;background:linear-gradient(transparent,rgba(0,0,0,.72));color:#fff}
.g-re figcaption .gt{font-size:calc(var(--g-ts) * 4cqw)}
.g-re figcaption .gk{margin-bottom:1.2cqw!important}
.g-re-s{display:grid;align-content:start;padding-right:2cqw}
.g-re-s div{display:grid;grid-template-columns:auto 1fr;column-gap:1cqw;row-gap:.6cqw;border-top:.1cqw solid var(--g-line);padding:1.4cqw 0 1.6cqw}
.g-re-s em{grid-row:1/3;font-style:normal;font-size:.9cqw;color:var(--g-acc);padding-top:.3cqw}
.g-re-s b{font-family:var(--g-fd);font-weight:var(--g-tw);font-size:1.9cqw;letter-spacing:var(--g-ls);text-transform:var(--g-tt);line-height:1.05}
.g-re-s span{font-size:1.1cqw;color:var(--g-mut)}

/* 8 · minimalista (foto dentro del titular) */
.g-mi{flex:1;position:relative;padding:3.4cqw 3.6cqw 3cqw;min-height:0;display:flex;flex-direction:column}
.g-mi .gt{font-size:calc(var(--g-ts) * 8.6cqw);max-width:86cqw;line-height:.98}
.g-mi-b{margin-top:auto;display:flex;justify-content:space-between;align-items:end;gap:4cqw;padding-bottom:2.4cqw}
.g-mi-b .gs{margin-top:0!important;max-width:30cqw}
.g-mi-b .gbtns{margin-top:0}
.g-mi-m{padding-top:1.6cqw;border-top:.1cqw solid var(--g-line)}

/* 9 · marco */
.gl-marco .vp{background:var(--g-bg)}
.g-ma{position:relative;flex:1;margin:1.6cqw;display:flex;flex-direction:column}
.g-ma .gn{position:absolute;left:0;right:0;top:0}
.g-ma-p{position:absolute;inset:0;border-radius:1.4cqw}
.g-ma-p::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.4),transparent 30%,transparent 55%,rgba(0,0,0,.35))}
.g-ma-t{position:absolute;z-index:2;left:1.6cqw;bottom:1.6cqw;max-width:50%;background:var(--g-bg);padding:2.8cqw 3cqw 3cqw;border-radius:1.2cqw}
.g-ma-t .gt{font-size:calc(var(--g-ts) * 4.4cqw)}
.g-ma-t .gs{margin-top:1.2cqw!important;font-size:1.15cqw}
.g-ma-card{right:2cqw;bottom:2cqw}

/* 10 · arco */
.g-ar{flex:1;display:grid;grid-template-columns:.92fr 1.08fr;gap:5cqw;padding:1.4cqw 3.6cqw 0;min-height:0;align-items:start}
.g-ar-l{position:relative}
.g-ar-p{aspect-ratio:1/1.2;border-radius:50% 50% 1.4cqw 1.4cqw/36% 36% 1.4cqw 1.4cqw}
.gbadge{position:absolute;z-index:3;right:-4cqw;bottom:6cqw;width:11cqw;height:11cqw;background:var(--g-acc);border-radius:50%;box-shadow:0 1.6cqw 3cqw -1.2cqw rgba(0,0,0,.4)}
.gbadge text{font:700 7.4px/1 var(--g-fb);letter-spacing:.18em;fill:var(--g-on)}
.gbadge circle{fill:var(--g-on)}
.g-ar-r{display:flex;flex-direction:column;align-items:flex-start;padding-top:2.6cqw}
.g-ar-r .gt{font-size:calc(var(--g-ts) * 5.4cqw)}

/* 11 · mosaico (bento) */
.g-mo{flex:1;display:grid;grid-template-columns:1.15fr 1fr .7fr;grid-template-rows:1fr 1fr;gap:1.2cqw;padding:.4cqw 1.6cqw 1.6cqw;min-height:0}
.g-mo-t{grid-row:1/3;background:var(--g-sur);border-radius:1.4cqw;padding:2.8cqw 2.6cqw;display:flex;flex-direction:column;align-items:flex-start}
.g-mo-t .gt{font-size:calc(var(--g-ts) * 4.6cqw);margin-top:auto}
.g-mo .a{grid-column:2/4;border-radius:1.4cqw}
.g-mo .b{border-radius:1.4cqw}
.g-mo-s{background:var(--g-acc);color:var(--g-on);border-radius:1.4cqw;padding:1.8cqw;display:flex;flex-direction:column}
.g-mo-s small{font:500 1cqw/1.2 var(--g-fb);opacity:.85}
.g-mo-s b{margin-top:auto;font-family:var(--g-fd);font-weight:var(--g-tw);font-size:3.4cqw;letter-spacing:var(--g-ls);line-height:1}
.g-mo-s span{margin-top:.8cqw;font-size:.95cqw;opacity:.8;letter-spacing:.1em;text-transform:uppercase}

/* 12 · banda de color */
.g-ba{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:1.2cqw;min-height:0;padding:0 1.6cqw 5.2cqw}
.g-ba-t{background:var(--g-acc);color:var(--g-on);border-radius:1.4cqw;padding:3.2cqw;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start}
.g-ba-t .gk,.g-ba-t .gs{color:var(--g-on);opacity:.85}
.g-ba-t .gk i{background:var(--g-on);box-shadow:none}
.g-ba-t .gc{background:var(--g-on);color:var(--g-acc);box-shadow:none}
.g-ba-t .gc i{background:var(--g-acc);color:var(--g-on)}
.g-ba-t .gt{font-size:calc(var(--g-ts) * 5.4cqw)}
.g-ba-r{position:relative;display:flex;min-height:0}
.g-ba-p{flex:1;border-radius:1.4cqw}
.g-ba-card{left:2cqw;top:2cqw}
.gl-banda .gtick{background:var(--g-ink);color:var(--g-bg)}

@media (prefers-reduced-motion:reduce){.gen *{animation:none!important}}
