/* ==========================================================================
   /publicidad/: media kit. Estilo Gala limpio: blanco y negro, un solo
   acento magenta, todo dentro de la retícula de la web (--wrap).
   Los dibujos de formatos (.pub-mk, .pub-vis) van en porcentajes.
   ========================================================================== */

.pub{background:#fff}
.pub-k{display:flex;align-items:center;gap:10px;color:var(--mute)}
.pub-k--accent{color:var(--accent)}
.pub-h2{margin:0;font-size:44px;line-height:.95;font-weight:400;text-transform:uppercase;letter-spacing:-.01em}
.pub-m{font:500 12px/1.6 ui-monospace,"SF Mono",Menlo,monospace;color:var(--mute)}
.pub-n{font:500 12.5px/1 ui-monospace,"SF Mono",Menlo,monospace;color:var(--star)}
.pub-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;height:52px;padding:0 24px;border:0;font:700 12px/1 var(--f-ui);letter-spacing:.2em;text-transform:uppercase;align-self:flex-start}
.pub-btn--ink{background:var(--ink);color:#fff}
.pub-btn--star{background:var(--star);color:#fff}
.pub-more{font:700 12px/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--accent);align-self:flex-start;padding:6px 0;border-bottom:1px solid currentColor}
.pub-sec{padding-block:88px}
.pub-band{background:var(--well);padding-block:88px}
.pub-band__head{display:flex;flex-direction:column;gap:16px;margin-bottom:44px}
.pub-band__head p{margin:0;max-width:62ch;font-size:18px;line-height:1.55;color:var(--ink-3)}

/* Apertura */
.pub-hero{padding-top:72px}
.pub-hero__top{margin-bottom:44px}
.pub-hero__title{margin:20px 0 0;max-width:780px;font-size:88px;line-height:.88;font-weight:400;text-transform:uppercase;letter-spacing:-.02em}
.pub-hero__title i{text-transform:none;color:var(--star)}
.pub-hero__dek{margin:22px 0 0;max-width:58ch;font-size:20px;line-height:1.5;color:var(--ink)}
.pub-hero__sub{margin:8px 0 0;font:500 15px/1.5 var(--f-ui);color:var(--mute)}
.pub-hero__btn{margin-top:26px}
.pub-hero__posters{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.pub-poster{aspect-ratio:2/3}
.pub-poster--x{display:none}
.pub-slot{aspect-ratio:2/3;background:var(--star);color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:18px}
.pub-slot .sc{font-size:10px}
.pub-slot__t{font-size:32px;line-height:.9;text-transform:uppercase}
.pub-slot__t i{text-transform:none}
.pub-index{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:22px;padding-top:18px;border-top:1px solid var(--ink)}
.pub-index a{font:600 15px/1.3 var(--f-ui)}
.pub-index a:hover{color:var(--accent)}

/* Por qué y cómo trabajamos: tres columnas iguales */
.pub-why,.pub-how{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.pub-why>div,.pub-how li{border-top:1px solid var(--ink);padding-top:18px;display:flex;flex-direction:column;gap:12px}
.pub-why h3,.pub-how h3{margin:0;font-size:28px;line-height:1.02;font-weight:400;text-transform:uppercase}
.pub-why p,.pub-how p{margin:0;font:400 15.5px/1.55 var(--f-ui);color:var(--ink-3)}
.pub-sec--how{padding-bottom:96px}

/* Visor de formatos display */
.pub-vis{display:grid;grid-template-columns:260px minmax(0,1fr) 280px;gap:40px;align-items:start}
.pub-vis__list{display:flex;flex-direction:column;border-top:1px solid var(--ink)}
.pub-fmt{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:13px 0 13px 14px;border:0;border-bottom:1px solid var(--line-3);border-left:3px solid transparent;background:none;text-align:left;cursor:pointer}
.pub-fmt b{font:600 15px/1.2 var(--f-ui);color:var(--ink)}
.pub-fmt span{font:500 11.5px/1.3 ui-monospace,"SF Mono",Menlo,monospace;color:var(--mute)}
.pub-fmt:hover b{color:var(--accent)}
.pub-fmt[aria-pressed="true"]{border-left-color:var(--star);background:#fff}
.pub-fmt[aria-pressed="true"] b{color:var(--accent)}
.pub-vis__stage{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:24px;align-items:end}
.pub-vis__web{position:relative;aspect-ratio:4/3.3;background:#fff;box-shadow:0 0 0 1px var(--line-3)}
.pub-vis__tel{position:relative;aspect-ratio:9/18;background:#fff;border:6px solid var(--ink);border-radius:20px;overflow:hidden}
.pub-vis__bar{position:absolute;left:0;right:0;top:0;height:8%;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:center}
.pub-vis__bar img{height:40%;width:auto}
.pub-vis__tel .pub-vis__bar{height:7%}
.pub-z{position:absolute;display:flex;align-items:center;justify-content:center;text-align:center;font:600 10px/1.2 var(--f-ui);border:1px dashed #C9C4CE;background:#F7F6F8;color:#9D98A3;transition:background .2s,color .2s,border-color .2s}
.pub-z.is-on{background:var(--star);border:1px solid var(--star);color:#fff}
.pub-vis__inter{position:absolute;inset:0;background:rgba(18,18,18,.55);display:none;align-items:center;justify-content:center}
.pub-vis__inter span{width:78%;height:62%;background:var(--star);color:#fff;display:flex;align-items:center;justify-content:center;text-align:center;font:600 10px/1.3 var(--f-ui)}
.pub-vis__inter i{position:absolute;right:13%;top:17%;width:18px;height:18px;border-radius:50%;background:#fff;color:var(--ink);font:700 12px/18px var(--f-ui);text-align:center;font-style:normal}
.pub-vis__inter.is-on{display:flex}
.pub-vis__info{display:flex;flex-direction:column;gap:16px;border-top:2px solid var(--star);padding-top:16px}
.pub-vis__info b{font-size:26px;line-height:1;font-weight:400;text-transform:uppercase}
.pub-vis__info dl{margin:0;display:flex;flex-direction:column;gap:12px}
.pub-vis__info dt{font:600 10.5px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--mute-2);margin-bottom:5px}
.pub-vis__info dd{margin:0;font:400 15px/1.45 var(--f-ui);color:var(--ink)}
@media (prefers-reduced-motion:reduce){.pub-z{transition:none}}

/* Proyectos especiales: dibujo + ficha común */
.pub-pro{display:grid;grid-template-columns:480px minmax(0,1fr);gap:56px;align-items:start;padding-block:40px;border-top:1px solid var(--line)}
.pub-pro:first-of-type{border-top:0;padding-top:0}
.pub-pro__fig{margin:0;display:flex;flex-direction:column;gap:8px}
.pub-pro__txt{display:flex;flex-direction:column;gap:14px}
.pub-pro__txt h3{margin:0;font-size:36px;line-height:1;font-weight:400;text-transform:uppercase}
.pub-pro__txt>p{margin:0;font:400 17px/1.5 var(--f-text);color:var(--ink-3)}
.pub-spec{margin:4px 0 6px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 28px;border-top:1px solid var(--ink);padding-top:16px}
.pub-spec>div:first-child{grid-column:1/-1}
.pub-spec dt{font:600 10.5px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--mute-2);margin-bottom:6px}
.pub-spec dd{margin:0;font:400 14.5px/1.5 var(--f-ui);color:var(--ink)}
.pub-spec ul{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px 28px}
.pub-spec li{position:relative;padding-left:14px}
.pub-spec li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;background:var(--star)}

/* Dibujos de los proyectos */
.pub-mk{position:relative;display:block;aspect-ratio:4/3;background:var(--line-2);overflow:hidden}
.pub-mk--dark{background:#0E0D0F}
.pub-pg{position:absolute;background:#fff}
.pub-pg--pad{padding:5% 6%;display:flex;flex-direction:column;gap:5%}
.pub-ln{position:absolute;background:#E4E1E7}
.pub-ln--t{height:1.6%}
.pub-ln--in{position:relative;display:block;height:4%;flex:none}
.pub-ad{position:absolute;overflow:hidden;background:var(--ink)}
.pub-ad--in{position:relative}
.pub-ad>img,.pub-fill>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.pub-fill{position:absolute;inset:0}
.pub-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.1) 30%,rgba(0,0,0,.85) 100%)}
.pub-sz{position:absolute;font:500 10px/1 ui-monospace,"SF Mono",Menlo,monospace;color:#fff;background:var(--star);padding:3px 5px;white-space:nowrap}
.pub-eg{position:absolute;left:8%;bottom:5%;font:500 10px/1 ui-monospace,"SF Mono",Menlo,monospace;color:var(--mute-2)}
.pub-lg{position:absolute;border:1px dashed var(--star);color:var(--accent);display:flex;align-items:center;justify-content:center;font:600 9px/1 var(--f-ui);letter-spacing:.1em;text-transform:uppercase;background:#fff}
.pub-lg--in{position:relative;width:62px;height:26px;flex:none}
.pub-lg--s{width:46px;height:20px}
.pub-lg--neg{background:transparent;color:#fff;border-color:#fff}
.pub-row{position:absolute;background:var(--ink);display:flex;gap:2%;padding:1.2% 1.5%}
.pub-row .ph{flex:1}
.pub-row .is-hl{outline:2px solid var(--star);outline-offset:-2px}
.pub-bo__head{display:flex;align-items:center;justify-content:space-between}
.pub-bo__head b{font-size:24px;font-weight:400;text-transform:uppercase;line-height:1}
.pub-bo__head>span{display:flex;align-items:center;gap:8px}
.pub-bo__by{font:500 9px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--mute-2)}
.pub-bo{display:grid;grid-template-columns:minmax(0,1fr) 30%;gap:6%;flex:1}
.pub-bo__list{display:flex;flex-direction:column;gap:7px;font:600 12px/1.2 var(--f-ui)}
.pub-bo__row{display:flex;gap:9px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:7px}
.pub-bo__row:last-child{border:0}
.pub-bo__row .d{color:var(--star);font-size:16px}
.pub-bo__row .ph{width:22px;height:32px;flex:none}
.pub-cz{flex:1;background:var(--ink);color:#fff;display:grid;grid-template-columns:minmax(0,1fr) 34%;gap:6%;padding:6%;align-items:center}
.pub-cz__t{display:flex;flex-direction:column;gap:8px}
.pub-cz__t b{font-size:24px;font-weight:400;line-height:.95;text-transform:uppercase}
.pub-cz__k{font:600 9px/1 var(--f-ui);letter-spacing:.2em;text-transform:uppercase;color:#B8B3BE}
.pub-cz__p{font:500 11px/1.3 var(--f-ui);color:#CFCBD3}
.pub-cz__b{align-self:flex-start;background:var(--star);font:700 9px/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;padding:8px 10px}
.pub-cz .ph{aspect-ratio:2/3}
.pub-nl{padding:6% 6% 0;display:flex;flex-direction:column;gap:4%;box-shadow:0 10px 30px rgba(0,0,0,.08)}
.pub-nl__head{display:flex;justify-content:space-between;align-items:center}
.pub-nl__head img{height:12px;width:auto}
.pub-nl__k{font:600 8.5px/1 var(--f-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--mute-2)}
.pub-nl__ban{aspect-ratio:3/1;flex:none}
.pub-nl__item{display:flex;gap:6%}
.pub-nl__item .ph{width:28%;aspect-ratio:2/3}
.pub-nl__item>span:last-child{flex:1;display:flex;flex-direction:column;gap:6px;padding-top:4px}
.pub-nl__item i{display:block;height:6px;background:#E4E1E7}
.pub-nl__item i:nth-child(2){width:80%}
.pub-nl__item i:nth-child(3){width:60%}
.pub-esp{position:absolute;left:7%;right:7%;bottom:8%;display:flex;justify-content:space-between;align-items:flex-end;color:#fff}
.pub-esp>span:first-child{display:flex;flex-direction:column;gap:6px}
.pub-esp b{font-size:40px;font-weight:400;line-height:.85;text-transform:uppercase}
.pub-esp .pub-cz__k{color:#fff}
.pub-esp__by{display:flex;flex-direction:column;align-items:flex-end;gap:6px;font:500 9px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase}

/* Creatividad genérica de marca en los dibujos */
.pub-brand{position:absolute;inset:0;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;gap:6%;padding:4%}
.pub-brand b{font:400 clamp(10px,1.3vw,18px)/1.05 var(--f-display);text-transform:uppercase;letter-spacing:.06em;text-align:center}
.pub-brand--v{flex-direction:column}
.pub-brand--v b{writing-mode:vertical-rl;transform:rotate(180deg)}
.pub-ad--in .pub-brand{flex-direction:column}
.pub-bc{gap:4%}
.pub-bc__by{display:flex;align-items:center;gap:8px;font:600 8.5px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--mute-2)}
.pub-bc b{font-size:24px;font-weight:400;line-height:1;text-transform:uppercase}
.pub-bc__img{height:42%;flex:none}

/* Caso */
.pub-case{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:64px;align-items:center}
.pub-case__fig{margin:0}
.pub-case__fig img{display:block;width:100%;height:auto}
.pub-case__m{display:none!important}
.pub-case__txt{display:flex;flex-direction:column;gap:18px}
.pub-case__title{margin:0;font-size:44px;line-height:.95;font-weight:400;text-transform:uppercase}
.pub-case__txt p{margin:0;font-size:18px;line-height:1.55;color:var(--ink-3)}
.pub-case__logo{max-width:160px;height:auto}

/* Contacto */
.pub-contact{background:var(--ink);color:#fff;padding-block:88px 96px}
.pub-contact__in{display:grid;grid-template-columns:380px minmax(0,1fr);gap:88px;align-items:start}
.pub-contact__side{display:flex;flex-direction:column;gap:22px}
.pub-contact__side p{margin:0;font-size:18px;line-height:1.55;color:#D9D6DC}
.pub-contact__mail{border-top:1px solid #3A3640;padding-top:22px;display:flex;flex-direction:column;gap:8px}
.pub-contact__mail .sc{color:#9D98A3}
.pub-contact__mail a{font-size:26px;line-height:1.1;overflow-wrap:anywhere}
.pub-form{display:flex;flex-direction:column;gap:26px;background:#fff;color:var(--ink);padding:44px 48px}
.pub-form__grid{display:grid;grid-template-columns:1fr 1fr;gap:24px 28px}
.pub-fld{display:flex;flex-direction:column;gap:8px}
.pub-fld>span,.pub-chks legend{font:600 11px/1 var(--f-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.pub-fld input,.pub-fld textarea{height:48px;border:0;border-bottom:1px solid var(--ink);background:transparent;font:400 17px var(--f-ui);padding:0 2px;border-radius:0;color:var(--ink);width:100%}
.pub-fld textarea{height:90px;padding-top:10px;resize:vertical}
.pub-fld input:focus,.pub-fld textarea:focus{outline:none;border-bottom:2px solid var(--star)}
.pub-chks{border:0;margin:0;padding:0}
.pub-chks legend{padding:0;margin-bottom:12px}
.pub-chks>div{display:flex;flex-wrap:wrap;gap:8px}
.pub-chk{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 15px;border:1px solid var(--line-3);font:600 13px/1.2 var(--f-ui);color:var(--ink-3);cursor:pointer}
.pub-chk input{width:16px;height:16px;margin:0;accent-color:var(--star)}
.pub-chk:has(input:checked){border-color:var(--ink);background:var(--ink);color:#fff}
.pub-ok{display:flex;gap:10px;align-items:flex-start;font:400 14px/1.45 var(--f-ui);color:var(--ink-3)}
.pub-ok input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--star);flex:none}
.pub-ok a{text-decoration:underline}
.pub-trap{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.pub-note{margin:0;padding:14px 16px;font:500 15px/1.45 var(--f-ui)}
.pub-note--ok{background:#E8F5EC;color:#0F5C2E}
.pub-note--error{background:#FDECF2;color:#8A0036}

/* Pantallas medianas: el visor pasa a dos filas */
@media (min-width:1024px) and (max-width:1279.98px){
	.pub-vis{grid-template-columns:240px minmax(0,1fr)}
	.pub-vis__info{grid-column:1/-1}
	.pub-pro{grid-template-columns:400px minmax(0,1fr);gap:40px}
	.pub-spec{grid-template-columns:1fr 1fr}
}

/* Móvil */
@media (max-width:1023.98px){
	.pub-h2{font-size:32px}
	.pub-sec,.pub-band{padding-block:56px}
	.pub-band__head{gap:12px;margin-bottom:28px}
	.pub-band__head p{font-size:16.5px}
	.pub-hero{padding-top:40px}
	.pub-hero__top{margin-bottom:28px}
	.pub-hero__btn{margin-top:20px}
	.pub-hero__title{font-size:48px;line-height:.9;margin-top:16px}
	.pub-hero__dek{font-size:17px;margin-top:16px}
	.pub-btn{align-self:stretch}
	.pub-hero__posters{grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;margin-inline:calc(var(--gutter) * -1)}
	.pub-poster--x{display:block}
	.pub-slot{padding:12px}
	.pub-slot .sc{font-size:8.5px}
	.pub-slot__t{font-size:22px}
	.pub-index{gap:8px 18px}
	.pub-index a{font-size:14px}
	.pub-why,.pub-how{grid-template-columns:1fr;gap:24px;margin-top:24px}
	.pub-why h3,.pub-how h3{font-size:24px}
	.pub-vis{grid-template-columns:1fr;gap:20px}
	.pub-vis__list{flex-direction:row;overflow-x:auto;border:0;gap:8px;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);scrollbar-width:none}
	.pub-fmt{flex:none;border:1px solid var(--ink);padding:10px 14px;gap:3px;background:#fff}
	.pub-fmt[aria-pressed="true"]{background:var(--ink);border-left-color:var(--ink)}
	.pub-fmt[aria-pressed="true"] b,.pub-fmt[aria-pressed="true"] span{color:#fff}
	.pub-vis__stage{grid-template-columns:1fr;justify-items:center}
	.pub-vis__web{display:none}
	.pub-fmt--desk{display:none}
	.pub-vis__tel{width:200px}
	.pub-vis__info b{font-size:22px}
	.pub-pro{grid-template-columns:1fr;gap:18px;padding-block:36px}
	.pub-pro__txt h3{font-size:28px}
	.pub-pro__txt>p{font-size:16px}
	.pub-spec{grid-template-columns:1fr;gap:14px}
	.pub-spec ul{grid-template-columns:1fr}
	.pub-case{grid-template-columns:1fr;gap:22px}
	.pub-case__d{display:none!important}
	.pub-case__m{display:block!important}
	.pub-case__title{font-size:34px}
	.pub-contact{padding:56px 0 0}
	.pub-contact__in{grid-template-columns:1fr;gap:32px}
	.pub-contact__side p{font-size:17px}
	.pub-contact__mail a{font-size:24px}
	.pub-form{margin-inline:calc(var(--gutter) * -1);padding:28px var(--gutter) 36px;gap:20px}
	.pub-form__grid{grid-template-columns:1fr;gap:20px}
	.pub-fld input,.pub-fld textarea{font-size:16px}
	.pub-chk{padding:0 13px;font-size:12.5px}
	.pub-form .pub-btn{width:100%}
}
