/* =========================================================================
   Grone Revelado · concepto "Créditos"
   Pantalla de proyección: imagen a sangre, grotesca expandida en mayúsculas,
   créditos en serif itálica. Negro y papel; un punto rojo para "Revelando".
   ========================================================================= */

:root{
  color-scheme: dark;
  --bg:#0A0A0A;
  --panel:#151515;
  --panel-2:#1E1D1B;
  --fg:#F2F1EC;
  --fg-2:#CFCDC6;
  --muted:#8F8E88;
  --line:#272725;
  --paper:#F2F1EC;
  --ink:#0A0A0A;
  --ink-muted:#55544F;
  --ink-line:#CFCDC6;
  --dot:#E0573F;
  --error-dark:#A3341F;
  --f-display:'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --f-credit:'Instrument Serif', 'Times New Roman', serif;
  --f-body:'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --gut-l:max(clamp(18px, 3vw, 40px), env(safe-area-inset-left, 0px));
  --gut-r:max(clamp(18px, 3vw, 40px), env(safe-area-inset-right, 0px));
  --fs-mega:clamp(52px, 11.5vw, 190px);
  --fs-xxl:clamp(40px, 7vw, 116px);
  --fs-xl:clamp(32px, 4.6vw, 72px);
  --fs-l:clamp(24px, 2.6vw, 40px);
  --fs-credit:clamp(22px, 2.2vw, 34px);
  --fs-body:clamp(16px, 1.15vw, 18px);
  --fs-label:11px;
  --admin-bar:0px;
}
/* Celular: la grotesca expandida no cabe con palabras largas; se angosta un poco y baja de tamaño. */
@media (max-width:560px){
  :root{--fs-mega:10.4vw;--fs-xxl:9vw;--fs-xl:8.2vw;--fs-l:6.4vw}
  .display{font-stretch:108%!important}
}
.display{overflow-wrap:break-word}
.admin-bar{--admin-bar:32px}
@media (max-width:782px){.admin-bar{--admin-bar:46px}}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:var(--fs-body);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,video{max-width:100%;height:auto;display:block}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
h1,h2,h3,p,figure,blockquote{margin:0}
[hidden]{display:none!important}

.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--fg);color:var(--bg);padding:12px 18px;font-weight:600}
.skip-link:focus{left:12px;top:calc(12px + var(--admin-bar))}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}

/* ---------- Utilidades ---------- */
.wrap{padding-left:var(--gut-l);padding-right:var(--gut-r)}
.display{font-family:var(--f-display);font-stretch:125%;font-weight:800;text-transform:uppercase;line-height:.9;letter-spacing:-.01em;text-wrap:balance}
.credit{font-family:var(--f-credit);font-style:italic;font-weight:400;font-size:var(--fs-credit);line-height:1.15;text-transform:none;letter-spacing:0}
.label{font-family:var(--f-body);font-size:var(--fs-label);font-weight:600;letter-spacing:.14em;text-transform:uppercase;line-height:1.4}
.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;font:600 13px/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border:1px solid currentColor;cursor:pointer;background:transparent;color:inherit;transition:background .3s,color .3s}
.btn:hover{background:var(--fg);color:var(--bg)}
.btn-solid{background:var(--fg);color:var(--bg)}
.btn-solid:hover{background:transparent;color:var(--fg)}
.gr-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* Portada compuesta: tríptico de fotos verticales en pantallas anchas; una sola foto en pantallas verticales. */
.gr-cover{display:flex;gap:4px;background:var(--bg)}
.gr-cover .gr-cover__img{position:static;flex:1 1 0;min-width:0;width:100%;height:100%;object-fit:cover;display:block}
picture.gr-cover{display:block}
@media (orientation: portrait){.gr-cover .gr-cover__extra{display:none}}
.empty{padding-block:60px 140px;font-family:var(--f-credit);font-style:italic;font-size:var(--fs-l);color:var(--muted)}

/* ---------- Encabezado ---------- */
.site-header{position:fixed;top:var(--admin-bar);left:0;right:0;z-index:50;padding-top:env(safe-area-inset-top, 0px);mix-blend-mode:difference;color:#FFFFFF}
.site-header .inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding-block:18px}
.site-header .left{display:flex;gap:24px}
.site-header a{text-decoration:none}
.site-header .brand{font-family:var(--f-display);font-stretch:125%;font-weight:800;font-size:15px;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap}
.site-header .right{justify-self:end}
.menu-btn{background:transparent;color:inherit;border:0;min-height:44px;padding:0 2px;font:600 11px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
@media (max-width:720px){.site-header .left{display:none}.site-header .inner{grid-template-columns:1fr auto}.site-header .brand{justify-self:start}}

/* ---------- Menú ---------- */
.menu{position:fixed;inset:var(--admin-bar) 0 0;z-index:70;background:var(--bg);color:var(--fg);display:flex;flex-direction:column;padding-top:env(safe-area-inset-top, 0px);padding-bottom:env(safe-area-inset-bottom, 0px)}
.menu .inner{display:flex;justify-content:space-between;align-items:center;padding-block:18px}
.menu .inner a{text-decoration:none}
.menu nav{flex:1;display:flex;flex-direction:column;justify-content:center}
.menu nav a{display:flex;align-items:baseline;gap:20px;text-decoration:none;padding-block:4px;border-bottom:1px solid var(--line)}
.menu nav a .display{font-size:clamp(44px,9vw,128px);transition:color .3s}
.menu nav a:hover .display{color:var(--muted)}
.menu .menu-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 28px;padding-block:22px}
.menu .menu-foot a{text-decoration:none}

/* ---------- Home: video de entrada ---------- */
.hero{position:relative;height:clamp(600px, 100vh, 1000px);background:var(--panel);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
.hero-shade{position:absolute;inset:0;background:linear-gradient(to top, rgba(0,0,0,.45), rgba(0,0,0,0) 40%)}
.hero .light{position:absolute;width:62vmax;height:62vmax;left:14%;top:-18%;border-radius:50%;background:radial-gradient(circle, rgba(242,236,222,.16) 0%, rgba(242,236,222,.05) 38%, rgba(0,0,0,0) 70%);animation:gr-drift 22s ease-in-out infinite alternate}
@keyframes gr-drift{to{transform:translate(18vw,14vh)}}
.hero .scene{position:absolute;top:calc(84px + var(--admin-bar) + env(safe-area-inset-top, 0px));left:0;right:0;display:flex;justify-content:flex-start;color:var(--fg)}
.hero .scene .rec{display:inline-flex;align-items:center;gap:8px}
.hero .scene .rec::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--dot)}
.hero .wordmark{position:relative;mix-blend-mode:difference;color:#FFFFFF;font-size:var(--fs-mega);padding-bottom:clamp(16px,2.4vw,36px);line-height:.82;white-space:nowrap}
.hero .wordmark > span{display:block}
.hero .foot{position:relative;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding-bottom:calc(20px + env(safe-area-inset-bottom, 0px));border-top:1px solid rgba(242,241,236,.18);padding-top:16px}
.hero .foot a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.hero .foot .muted{color:var(--fg-2)}
@media (max-width:720px){.hero .wordmark{white-space:normal}}

/* ---------- Frase ---------- */
.frase{padding-block:clamp(120px,14vw,220px)}
.frase p{font-size:var(--fs-xxl);max-width:13ch}
.frase p em{font-family:var(--f-credit);font-style:italic;font-weight:400;text-transform:none;font-stretch:100%;letter-spacing:-.01em;font-size:1.08em}

/* ---------- Manifiesto ---------- */
.manifiesto{border-top:1px solid var(--line);padding-block:28px clamp(110px,12vw,170px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:48px}
.manifiesto .tag{grid-column:1 / span 3}
.manifiesto .lead{grid-column:4 / span 9;font-size:var(--fs-xl);max-width:16ch}
.manifiesto .cols{grid-column:4 / span 9;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 48px;color:var(--fg-2);max-width:62rem}
@media (max-width:900px){.manifiesto .tag,.manifiesto .lead,.manifiesto .cols{grid-column:1 / -1}.manifiesto .cols{grid-template-columns:minmax(0,1fr)}}
.img-manifiesto{position:relative;height:clamp(420px,80vh,860px);background:var(--panel-2);overflow:hidden}

/* ---------- Historias: proyección a pantalla completa ---------- */
.h-index{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px;padding-block:clamp(100px,11vw,160px) 28px;border-bottom:1px solid var(--line)}
.h-index h2{font-size:var(--fs-xl)}
.h-index p{max-width:24rem}
.reel{position:relative;display:flex;flex-direction:column;justify-content:flex-end;height:clamp(520px,92vh,980px);text-decoration:none;overflow:hidden;background:var(--panel);border-bottom:1px solid var(--bg)}
.reel .gr-media{transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.reel:hover .gr-media{transform:scale(1.025)}
.reel .shade{position:absolute;inset:0;background:linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,0) 50%)}
.reel .top{position:absolute;top:22px;left:0;right:0;display:flex;justify-content:space-between;color:var(--fg-2)}
.reel .info{position:relative;display:flex;flex-direction:column;gap:12px;padding-bottom:clamp(24px,3vw,44px)}
.reel .info .muted{color:var(--fg-2)}
.reel .title{font-size:var(--fs-xxl);transition:letter-spacing .6s ease}
.reel:hover .title{letter-spacing:.01em}
.reel .row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px 32px}
.reel .see{display:inline-flex;align-items:center;gap:10px}
.reel .see::after{content:"";width:28px;height:1px;background:currentColor;transition:width .4s}
.reel:hover .see::after{width:56px}

.archivo-door{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:24px;align-items:end;padding-block:clamp(80px,9vw,130px)}
.archivo-door .tag{grid-column:1 / span 3}
.archivo-door .big{grid-column:4 / span 6;font-size:var(--fs-l);max-width:18ch}
.archivo-door .btn{grid-column:10 / span 3;justify-self:end}
@media (max-width:900px){.archivo-door .tag,.archivo-door .big,.archivo-door .btn{grid-column:1 / -1;justify-self:start}}

/* ---------- Conversemos: bloque invertido ---------- */
.talk{background:var(--paper);color:var(--ink)}
.talk .inner{padding-block:clamp(110px,12vw,180px) clamp(60px,6vw,90px);display:flex;flex-direction:column;gap:clamp(28px,3vw,44px)}
.talk h2{font-size:var(--fs-mega);line-height:.84}
.talk .row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:28px}
.talk p{max-width:30rem;color:var(--ink-muted);font-size:clamp(17px,1.3vw,20px)}
.talk .btn{color:var(--ink)}
.talk .btn:hover{background:var(--ink);color:var(--paper)}
.talk .btn-solid{background:var(--ink);color:var(--paper)}
.talk .btn-solid:hover{background:transparent;color:var(--ink)}
.talk .actions{display:flex;flex-wrap:wrap;gap:12px}
.talk a:focus-visible{outline-color:var(--ink)}

/* ---------- Pie ---------- */
.site-footer-wrap{background:var(--bg);color:var(--fg)}
.site-footer{padding-block:28px calc(24px + env(safe-area-inset-bottom, 0px));display:flex;flex-direction:column;gap:28px}
.site-footer .cols{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px 40px;color:var(--muted)}
.site-footer nav{display:flex;flex-wrap:wrap;gap:8px 24px}
.site-footer a{text-decoration:none}
.site-footer a:hover{color:var(--fg)}
/* Contacto visible: WhatsApp, Instagram, correo */
.contact-row{display:flex;flex-wrap:wrap;gap:20px clamp(32px,6vw,96px);padding-block:clamp(40px,5vw,72px) 8px;border-bottom:1px solid var(--line)}
.contact-big{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--fg);min-height:44px}
.contact-big .label{color:var(--muted)}
.contact-big__value{font-family:var(--f-display);font-stretch:112%;font-weight:700;font-size:clamp(22px,2.6vw,38px);line-height:1;letter-spacing:-.01em;transition:color .3s}
.contact-big:hover .contact-big__value{color:var(--muted)}
.menu .menu-foot{align-items:flex-end}
.menu .menu-foot .contact-big__value{font-size:clamp(20px,2.2vw,30px)}
/* Botón flotante de WhatsApp: aparece al pasar la entrada */
.wa-float{position:fixed;z-index:45;right:calc(16px + env(safe-area-inset-right, 0px));bottom:calc(16px + env(safe-area-inset-bottom, 0px));display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 18px;background:var(--paper);color:var(--ink);text-decoration:none;font:600 12px/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;box-shadow:0 6px 24px rgba(0,0,0,.35);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .4s,transform .4s}
.wa-float.on{opacity:1;transform:none;pointer-events:auto}
.wa-float:hover{background:var(--fg-2)}
.wa-float:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
@media (max-width:560px){.wa-float span{display:none}.wa-float{padding:0;width:52px;justify-content:center;border-radius:50%}}
.site-footer .giant{font-size:clamp(30px,7.2vw,150px);line-height:.8;color:var(--fg);text-decoration:none;max-width:100%;overflow-wrap:anywhere}

/* ---------- Historia individual ---------- */
.s-hero{position:relative;height:clamp(560px,100vh,1000px);background:var(--panel);display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
.s-hero .shade{position:absolute;inset:0;background:linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,0) 50%)}
.s-hero .info{position:relative;display:flex;flex-direction:column;gap:14px;padding-bottom:clamp(28px,3vw,44px)}
.s-hero .info .muted{color:var(--fg-2)}
.s-hero h1{font-size:var(--fs-mega);line-height:.84}
.s-credits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding-block:28px;border-bottom:1px solid var(--line);margin:0}
.s-credits dt{margin-bottom:6px;color:var(--muted)}
.s-credits dd{margin:0;font-size:16px}
@media (max-width:720px){.s-credits{grid-template-columns:repeat(2,minmax(0,1fr))}}
.s-summary{padding-top:clamp(56px,6vw,90px);font-size:var(--fs-l);line-height:1.25;max-width:28ch;font-family:var(--f-display);font-stretch:125%;font-weight:700;text-transform:uppercase}

/* Contenido del editor de bloques dentro de una Historia */
.s-content{counter-reset:chapter;padding-bottom:clamp(40px,5vw,80px);color:var(--fg-2)}
.s-content > *{padding-left:var(--gut-l);padding-right:var(--gut-r);margin-top:clamp(48px,6vw,90px)}
.s-content > .alignfull{padding-left:0;padding-right:0}
.s-content > .alignfull img,.s-content > .alignfull video{width:100%;max-height:92vh;object-fit:cover}
.s-content > p,.s-content > h2,.s-content > h3,.s-content > blockquote,.s-content > ul{max-width:calc(46rem + var(--gut-l) + var(--gut-r))}
.s-content h2,.s-content h3{font-family:var(--f-display);font-stretch:125%;font-weight:800;text-transform:uppercase;line-height:.95;color:var(--fg);font-size:var(--fs-l);text-wrap:balance}
.s-content p{margin:0}
.s-content a{text-decoration-thickness:1px;text-underline-offset:3px}
.s-content blockquote,.s-content .wp-block-quote{border:0;padding-left:0;margin:0}
.s-content .wp-block-quote p{font-family:var(--f-credit);font-style:italic;font-size:var(--fs-xl);line-height:1.05;color:var(--fg);max-width:18ch}
.s-content .wp-block-quote cite{display:block;margin-top:14px;font:600 11px/1.4 var(--f-body);letter-spacing:.14em;text-transform:uppercase;font-style:normal;color:var(--muted)}
.s-content figcaption{margin-top:10px;font-size:13px;color:var(--muted)}
.s-content .wp-block-image{position:relative}
.s-content .wp-block-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.s-content .wp-block-gallery .wp-block-image{width:auto!important;margin:0}
.s-content .wp-block-gallery img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5}
@media (max-width:720px){.s-content .wp-block-gallery{grid-template-columns:minmax(0,1fr)}}
.s-content .wp-block-columns{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-end}
.s-content .wp-block-column{flex:1 1 280px;min-width:0}
.s-content .wp-block-video video,.s-content .wp-block-embed iframe{width:100%}
.s-content .wp-block-embed__wrapper{position:relative;aspect-ratio:16/9}
.s-content .wp-block-embed__wrapper iframe{position:absolute;inset:0;height:100%}
.s-content hr,.s-content .wp-block-separator{border:0;border-top:1px solid var(--line);margin-left:var(--gut-l);margin-right:var(--gut-r);padding:0}

/* Capítulo: etiqueta numerada a la izquierda, texto en las columnas 4–10 */
.s-content > .gr-chapter{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:22px;margin-top:clamp(80px,9vw,140px);max-width:none}
.gr-chapter > *{grid-column:4 / span 7;margin:0}
.gr-chapter > .gr-chapter__label{grid-column:1 / span 3;grid-row:1;align-self:start;display:flex;flex-direction:column;gap:6px;font:600 11px/1.4 var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);counter-increment:chapter}
.gr-chapter > .gr-chapter__label::before{content:counter(chapter, decimal-leading-zero);font-family:var(--f-display);font-stretch:125%;font-weight:800;font-size:13px;letter-spacing:0;color:var(--fg)}
@media (max-width:900px){.gr-chapter > *,.gr-chapter > .gr-chapter__label{grid-column:1 / -1}.gr-chapter > .gr-chapter__label{grid-row:auto;flex-direction:row;gap:12px}}

.next{margin-top:clamp(100px,12vw,170px)}
.next .reel{height:clamp(380px,70vh,720px)}
.s-nav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-block:22px;border-bottom:1px solid var(--line)}
.s-nav a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}

/* ---------- Archivo: índice ---------- */
.page-top{padding-top:calc(120px + var(--admin-bar) + env(safe-area-inset-top, 0px))}
.a-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;padding-bottom:36px}
.a-head h1{font-size:var(--fs-mega);line-height:.84}
.filters{display:flex;flex-wrap:wrap;gap:4px 22px;padding-block:18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.chip{min-height:44px;display:inline-flex;align-items:center;color:var(--muted);text-decoration:none;font:600 11px/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase}
.chip:hover{color:var(--fg)}
.chip[aria-current="page"]{color:var(--fg);text-decoration:underline;text-underline-offset:6px}
.chip .n{font-variant-numeric:tabular-nums;margin-left:4px}
.a-list{list-style:none;margin:0;padding:0 0 140px}
.a-row a{display:grid;grid-template-columns:70px minmax(0,1fr) minmax(0,.6fr) minmax(0,.6fr) 40px;align-items:center;gap:20px;padding-block:22px;border-bottom:1px solid var(--line);text-decoration:none;transition:padding .4s,color .3s}
.a-row a:hover{padding-left:12px}
.a-row .t{font-family:var(--f-display);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:clamp(20px,2.2vw,34px);line-height:1}
.a-row .c{font-size:20px}
.a-row .y{font-variant-numeric:tabular-nums}
.a-row .arrow{justify-self:end}
@media (hover:hover){.a-list:hover .a-row a{color:var(--muted)}.a-list:hover .a-row a:hover{color:var(--fg)}}
@media (max-width:720px){.a-row a{grid-template-columns:52px minmax(0,1fr);row-gap:6px}.a-row .c,.a-row .k{grid-column:2}.a-row .arrow{display:none}}
.peek{position:fixed;z-index:40;width:280px;aspect-ratio:4/5;background:var(--panel-2);pointer-events:none;opacity:0;transition:opacity .25s;overflow:hidden}
.peek img{width:100%;height:100%;object-fit:cover}
.peek.on{opacity:1}
@media (hover:none){.peek{display:none}}

/* ---------- Conversemos (página clara) ---------- */
body.is-paper{background:var(--paper)}
.c-page{background:var(--paper);color:var(--ink);padding-bottom:120px}
.c-head{display:flex;flex-direction:column;gap:22px;padding-bottom:clamp(48px,6vw,80px);border-bottom:1px solid var(--ink-line)}
.c-head h1{font-size:var(--fs-mega);line-height:.84}
.c-head p{max-width:34rem;color:var(--ink-muted);font-size:clamp(17px,1.3vw,20px)}
.c-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;padding-top:48px;scroll-margin-top:100px}
.c-side{grid-column:1 / span 4;display:flex;flex-direction:column;gap:14px;color:var(--ink-muted);font-size:15px}
.c-side strong{color:var(--ink);font-weight:600}
.c-side a{text-decoration-thickness:1px;text-underline-offset:3px}
.c-form-wrap{grid-column:6 / span 7}
@media (max-width:900px){.c-side,.c-form-wrap{grid-column:1 / -1}.c-side{padding-bottom:40px}}
.c-page form{display:flex;flex-direction:column;gap:30px}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.field .help{font-size:14px;color:var(--ink-muted);line-height:1.5}
.field input,.field textarea,.field select{background:transparent;color:var(--ink);border:0;border-bottom:1px solid #A9A79F;padding:10px 0;font:400 19px/1.45 var(--f-body);border-radius:0;width:100%}
.field textarea{min-height:130px;resize:vertical}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 9px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.field input:focus,.field textarea:focus,.field select:focus{border-bottom-color:var(--ink);outline:none;box-shadow:0 1px 0 0 var(--ink)}
.field .err{font-size:14px;color:var(--error-dark)}
.field .err:empty{display:none}
.field.invalid input,.field.invalid textarea{border-bottom-color:var(--error-dark)}
.row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
@media (max-width:560px){.row2{grid-template-columns:minmax(0,1fr)}}
.optional{color:var(--ink-muted);font-weight:500;letter-spacing:.06em;text-transform:none}
.check{display:flex!important;gap:12px;align-items:flex-start;font-size:15px!important;line-height:1.5;color:var(--ink);text-transform:none!important;letter-spacing:0!important;font-weight:400!important}
.check input{width:20px;height:20px;margin-top:2px;accent-color:var(--ink);flex-shrink:0}
.form-foot{display:flex;flex-wrap:wrap;align-items:center;gap:20px}
.form-error{border-left:2px solid var(--error-dark);padding:4px 0 4px 14px;margin-bottom:28px;color:var(--error-dark)}
.gr-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.c-page .btn{color:var(--ink)}
.c-page .btn:hover{background:var(--ink);color:var(--paper)}
.c-page .btn-solid{background:var(--ink);color:var(--paper)}
.c-page .btn-solid:hover{background:transparent;color:var(--ink)}
.c-page a:focus-visible,.c-page button:focus-visible,.c-page input:focus-visible,.c-page textarea:focus-visible,.c-page select:focus-visible{outline-color:var(--ink)}
.success{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.success h2{font-size:var(--fs-xl)}
.success p{color:var(--ink-muted)}

/* ---------- Páginas genéricas y 404 ---------- */
.p-body{display:flex;flex-direction:column;gap:28px;max-width:46rem;padding-bottom:140px;color:var(--fg-2)}
.p-body h1{font-size:var(--fs-xl);color:var(--fg)}
.p-content{display:flex;flex-direction:column;gap:18px}
.p-content h2,.p-content h3{font-family:var(--f-display);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:20px;color:var(--fg);margin-top:16px}
.not-found{display:flex;flex-direction:column;align-items:flex-start;gap:24px;padding-bottom:160px}
.not-found h1{font-size:var(--fs-xxl)}

/* =========================================================================
   Acento amarillo · marca B "Créditos"
   Regla: el amarillo es la firma (el punto) y todo lo que invita a actuar.
   Nunca en párrafos largos. Sobre amarillo, el texto va en negro.
   ========================================================================= */
:root{--accent:#F2DF2E;--on-accent:#0A0A0A;--dot:var(--accent)}
::selection{background:var(--accent);color:var(--on-accent)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline-color:var(--accent)}

/* El punto del logo */
.gr-dot{display:inline-block;width:.19em;height:.19em;border-radius:50%;background:var(--accent);margin-left:.06em;vertical-align:baseline}
.site-header .brand .gr-dot,.giant .gr-dot{width:.22em;height:.22em}

/* Frase: las palabras en cursiva */
.frase p em{color:var(--accent)}
.frase p{max-width:17ch;overflow-wrap:normal}

/* Encabezado sobre el bloque amarillo: negro sólido (sin inversión de color) */
.site-header.on-accent{mix-blend-mode:normal;color:var(--on-accent)}
.site-header.on-accent .gr-dot{background:var(--on-accent)}

/* Menú: números y hover */
.menu nav a > .label{color:var(--accent)}
.menu nav a:hover .display{color:var(--accent)}

/* Historias en la Home */
.reel .top{color:var(--accent)}
.reel .see::after{background:var(--accent)}
.reel:hover .title{color:var(--accent)}
.reel:hover .see{color:var(--accent)}

/* Botones en fondo oscuro: al pasar el mouse se encienden en amarillo */
.btn:hover{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

/* Bloque Conversemos: el golpe de color de la página */
.talk{background:var(--accent);color:var(--on-accent)}
.talk p{color:rgba(10,10,10,.75)}
.talk .btn{color:var(--on-accent);border-color:var(--on-accent)}
.talk .btn:hover{background:var(--on-accent);color:var(--accent);border-color:var(--on-accent)}
.talk .btn-solid{background:var(--on-accent);color:var(--accent)}
.talk .btn-solid:hover{background:transparent;color:var(--on-accent)}
.talk a:focus-visible{outline-color:var(--on-accent)}

/* Contacto */
.contact-big:hover .contact-big__value{color:var(--accent)}
.wa-float{background:var(--accent);color:var(--on-accent)}
.wa-float:hover{background:#FFFFFF}
.wa-float:focus-visible{outline-color:#FFFFFF}

/* Historia: números de capítulo y barra de lectura */
.gr-chapter > .gr-chapter__label::before{color:var(--accent)}
.s-content .wp-block-quote{border-left:3px solid var(--accent);padding-left:clamp(16px,2vw,28px)}
.gr-progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:55;pointer-events:none}
.gr-progress span{display:block;height:100%;background:var(--accent);transform-origin:0 50%;transform:scaleX(0)}

/* Archivo */
.chip[aria-current="page"]{color:var(--accent);text-decoration-color:var(--accent)}
.a-row .arrow{color:var(--accent)}
@media (hover:hover){.a-list:hover .a-row a:hover{color:var(--accent)}}

/* Conversemos (página clara): el botón de enviar en amarillo con borde negro */
.c-page .btn-solid{background:var(--accent);color:var(--ink);border-color:var(--ink)}
.c-page .btn-solid:hover{background:var(--ink);color:var(--accent)}
.c-page ::selection{background:var(--accent);color:var(--ink)}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}