/* Reizu × Gio Canto Books — prototipo de hero narrativo */
:root{--paper:#f8f7f3;--ink:#171717;--red:#ed3038;--gold:#ac824a;--mute:#74726e;--line:#dedcd5;--sans:"DM Sans",Arial,sans-serif;--serif:"Libre Baskerville",Georgia,serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;min-width:320px;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid var(--red);outline-offset:4px}
.rc-skip{position:fixed;z-index:200;left:18px;top:-75px;background:var(--ink);color:white;padding:12px 16px;font-size:13px}.rc-skip:focus{top:15px}
.rc-svg-library{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.rc-header{height:79px;position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(248,247,243,.92);border-bottom:1px solid #dedbd2;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.rc-header-inner{height:100%;width:min(100% - 100px,1610px);margin:auto;display:flex;align-items:center;justify-content:space-between}
.rc-lockup{display:flex;align-items:center;gap:8px}
.rc-gcb-logo{font:400 18px/1.07 var(--serif);letter-spacing:-.06em;white-space:nowrap}.rc-gcb-logo strong{font-weight:700}
.rc-cross{font:400 22px/1 var(--sans);color:var(--red)}
.rc-reizu-logo{font:1000 18px/.82 var(--sans);letter-spacing:-.105em;transform:skewX(-4deg);white-space:nowrap}
.rc-header nav{display:flex;align-items:center;gap:32px}
.rc-header nav a{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;transition:color .2s}
.rc-header nav a:hover{color:var(--red)}.rc-header nav a span{font-size:15px;margin-left:4px}
.rc-story{height:510svh;position:relative}
.rc-stage{height:100svh;min-height:530px;position:sticky;top:0;overflow:hidden;background:var(--paper);isolation:isolate;perspective:1200px}
.rc-paper-grid{position:absolute;inset:0;pointer-events:none;opacity:.42;background-image:linear-gradient(rgba(60,58,53,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(60,58,53,.055) 1px,transparent 1px);background-size:90px 90px;background-position:center top;mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 70%,transparent 100%)}
.rc-paper-grid::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 46%,rgba(255,255,255,.9),transparent 58%)}
.rc-rail{position:absolute;z-index:9;top:50%;font-size:9px;letter-spacing:.22em;font-weight:700;color:#99958d;white-space:nowrap}
.rc-rail-left{left:20px;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg)}
.rc-rail-right{right:20px;writing-mode:vertical-rl;transform:translateY(-50%)}
.rc-topline{position:absolute;z-index:10;left:max(62px,7vw);right:max(62px,7vw);top:calc(79px + clamp(24px,4vh,44px));display:flex;align-items:center;justify-content:space-between}
.rc-eyebrow,.rc-topline-index{font-size:10px;letter-spacing:.15em;font-weight:800}.rc-eyebrow{display:inline-flex;align-items:center;gap:11px}
.rc-eyebrow i{display:block;background:var(--red);width:25px;height:4px}
.rc-topline-index{color:#85817a}.rc-topline-index b{color:var(--red);margin:0 8px}
.rc-monitor{position:absolute;z-index:2;left:50%;top:49%;width:clamp(290px,38vw,510px);transform:translate3d(-50%,-50%,0);transform-origin:center center;will-change:transform,opacity;filter:drop-shadow(0 10px 16px rgba(22,18,14,.08))}
.rc-monitor-frame{padding:clamp(9px,1vw,14px);background:#242525;border:2px solid #121212;border-radius:20px 20px 11px 11px;box-shadow:inset 0 2px 2px #535353,0 9px 0 #171717,0 24px 55px rgba(19,19,19,.13);aspect-ratio:var(--rc-monitor-ratio,1.71);overflow:hidden}
.rc-monitor-screen{height:100%;border:1px solid #111;border-radius:5px;background:#f6f5f1;overflow:hidden}
.rc-fake-browser{height:23px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:#1d1d1d;color:white}
.rc-browser-dots{display:flex;gap:4px}.rc-browser-dots b{width:5px;height:5px;background:#aaa;border-radius:50%}.rc-browser-dots b:first-child{background:var(--red)}
.rc-browser-url{font-size:7px;font-weight:700;letter-spacing:.22em;color:#bbb}.rc-browser-menu{font-size:10px}
.rc-fake-site{height:calc(100% - 23px);display:flex;flex-direction:column;padding:2.3% 4% 0;background:linear-gradient(90deg,#f5f4f0 30%,#ebebe8)}
.rc-site-heading{display:flex;align-items:flex-start;justify-content:space-between;border-bottom:2px solid #111;padding-bottom:7px}
.rc-site-heading strong{font:1000 clamp(18px,2.25vw,31px)/.8 var(--sans);letter-spacing:-.1em;transform:skewX(-4deg)}
.rc-site-heading span{text-align:right;font-size:clamp(6px,.68vw,9px);font-weight:800;letter-spacing:.05em}
.rc-site-cover{flex:1;min-height:0;position:relative;overflow:hidden;border-bottom:2px solid #111;background:#e8e6e0;margin-top:10px;display:grid;grid-template-columns:52% 48%}
.rc-site-cover>svg{height:100%;width:100%;object-fit:cover;filter:grayscale(1);align-self:center}
.rc-site-cover-caption{padding:8% 7%;display:flex;flex-direction:column;justify-content:center;gap:13px;background:#f0eee9}
.rc-site-cover-caption span{font-size:clamp(6px,.7vw,9px);letter-spacing:.1em;font-weight:800;color:var(--red)}
.rc-site-cover-caption strong{font-size:clamp(16px,2.4vw,35px);line-height:.95;letter-spacing:-.07em;font-weight:800}
.rc-site-bottom{height:23px;display:flex;align-items:center;gap:10px;font-size:7px;font-weight:700;letter-spacing:.12em}
.rc-site-bottom i{background:var(--red);height:3px;width:16px}.rc-site-bottom span:last-child{margin-left:auto;font-size:13px}
.rc-monitor-neck{height:31px;width:16%;margin:0 auto;background:linear-gradient(90deg,#999 0%,#e1e1e1 24%,#aaa 78%,#828282);clip-path:polygon(16% 0,84% 0,93% 100%,7% 100%);box-shadow:0 2px 3px #aaa}
.rc-monitor-base{width:35%;height:9px;margin:-2px auto 0;background:linear-gradient(#d9d9d9,#787878);border-radius:55% 55% 13px 13px;box-shadow:0 7px 12px #b9b7b4}
.rc-monitor-shadow{height:19px;width:83%;margin:8px auto;background:radial-gradient(ellipse,rgba(21,21,21,.16),transparent 71%);filter:blur(5px)}
.rc-floating-sheet{position:absolute;z-index:5;left:50%;top:48%;height:clamp(145px,25vh,225px);aspect-ratio:var(--rc-cover-ratio,.72);opacity:0;transform:translate3d(-50%,-50%,0) scale(.3);transform-style:preserve-3d;will-change:transform,opacity}
.rc-sheet-face{height:100%;position:relative;border:5px solid #fff;outline:1px solid #151515;overflow:hidden;background:#fff;box-shadow:9px 15px 30px rgba(0,0,0,.19);backface-visibility:hidden}
.rc-sheet-face svg{width:100%;height:100%;display:block}.rc-sheet-strip{position:absolute;bottom:6%;left:0;padding:9px 18px;background:var(--red);color:#fff;font-size:8px;letter-spacing:.12em;font-weight:800}
.rc-sheet-shadow{position:absolute;width:90%;height:10px;left:5%;bottom:-45px;background:#222;opacity:.13;filter:blur(16px)}
.rc-book{position:absolute;z-index:7;left:50%;top:52%;width:clamp(135px,14vw,205px);aspect-ratio:var(--rc-cover-ratio,.72);opacity:0;transform:translate3d(-50%,-50%,0) scale(.1);transform-style:preserve-3d;will-change:transform,opacity;filter:drop-shadow(0 14px 24px rgba(0,0,0,.12))}
.rc-book-object{width:100%;height:100%;position:relative;transform-style:preserve-3d}
.rc-book-front,.rc-book-back,.rc-book-spine,.rc-book-pages{position:absolute;backface-visibility:hidden}
.rc-book-front{inset:0;background:#f8f7f3;transform:translateZ(11px);overflow:hidden;border:2px solid #1e1e1e;border-radius:2px 7px 7px 2px;box-shadow:inset 5px 0 9px rgba(0,0,0,.42),2px 7px 16px rgba(0,0,0,.21)}
.rc-cover-art{position:absolute;inset:0 0 23% 0;background:#eee;overflow:hidden}
.rc-cover-art svg{display:block;width:100%;height:100%;filter:grayscale(1);object-fit:cover}
.rc-cover-title{position:absolute;inset:auto 0 25px;padding:20px 13px 18px 18px;background:#151515;color:#fff;min-height:29%}
.rc-cover-title span{display:block;font:800 clamp(6px,.57vw,8px)/1.4 var(--sans);color:#f25b60;letter-spacing:.13em;margin-bottom:8px}
.rc-cover-title strong{font:800 clamp(24px,2.3vw,34px)/.96 var(--sans);letter-spacing:-.055em}
.rc-cover-bottom{position:absolute;bottom:0;left:0;right:0;height:25px;display:flex;align-items:center;justify-content:center;gap:6px;background:var(--red);color:#fff;font-size:clamp(6px,.54vw,8px);letter-spacing:.025em;font-weight:800}
.rc-cover-bottom b{font-size:13px}
.rc-book-back{inset:0;transform:translateZ(-11px) rotateY(180deg);border-radius:2px;background:#171717}
.rc-book-spine{left:-11px;top:0;bottom:0;width:22px;background:#222;transform:rotateY(-90deg);display:grid;place-items:center;border-left:2px solid #121212;border-right:2px solid #333}
.rc-book-spine span{writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap;color:#f5f4f0;font-size:10px;font-weight:800;letter-spacing:.11em}
.rc-book-pages{right:-11px;top:3px;bottom:3px;width:22px;transform:rotateY(90deg);background:repeating-linear-gradient(0deg,#b7b5ae 0px,#f2f0eb 2px,#d8d6cf 3px);border-right:2px solid #777}
.rc-book-shadow{position:absolute;left:10%;right:-12%;bottom:-59px;height:30px;background:radial-gradient(ellipse,rgba(0,0,0,.24),transparent 74%);filter:blur(8px)}
.rc-headline{position:absolute;z-index:11;left:max(65px,9.7vw);top:35%;width:min(47vw,730px);opacity:0;transform:translateY(32px);pointer-events:none;will-change:transform,opacity}
.rc-headline.is-visible{pointer-events:auto}
.rc-headline-label{font-size:11px;font-weight:800;letter-spacing:.1em;display:flex;align-items:center;gap:13px;white-space:nowrap}
.rc-red-dash{background:var(--red);width:30px;height:4px;display:inline-block}
.rc-headline h1{font:800 clamp(50px,5.7vw,96px)/1.06 var(--sans);letter-spacing:-.078em;margin:27px 0 17px}
.rc-headline h1 em{font:400 .88em/1.15 var(--serif);letter-spacing:-.07em;white-space:nowrap}
.rc-headline p{font-size:clamp(13px,1.15vw,16px);line-height:1.9;color:#5f5b55;max-width:430px;margin:0 0 31px}
.rc-action{min-height:50px;display:inline-flex;align-items:center;justify-content:space-between;gap:38px;padding:0 19px;background:var(--red);color:white;font-size:11px;letter-spacing:.05em;font-weight:800;transition:background .2s,transform .2s}
.rc-action:hover{background:#cb1d26;transform:translateY(-3px)}.rc-action span{font-size:17px}
.rc-progress-area{position:absolute;z-index:12;left:max(60px,7vw);right:max(60px,7vw);bottom:clamp(28px,6vh,61px);display:flex;align-items:center;justify-content:space-between;pointer-events:none}
.rc-scroll-instruction{display:flex;gap:24px;align-items:center;font-size:10px;letter-spacing:.13em;font-weight:800;color:#5b5751}
.rc-scroll-arrow{font-size:21px;font-weight:400;animation:rc-arrow 1.7s ease-in-out infinite}
.rc-step-indicator{font-size:14px;letter-spacing:.07em;color:#a4a09a;font-weight:700}.rc-current-step{font-weight:800;color:var(--red)}
.rc-progress-track{position:absolute;z-index:12;bottom:0;left:0;right:0;height:4px;background:#e3e0d8}
.rc-progress-fill{display:block;width:0;height:100%;background:var(--red);will-change:width}
@keyframes rc-arrow{50%{transform:translateY(6px)}}
@media(min-width:1600px){.rc-headline{top:34%}.rc-monitor{top:49%}}
@media(max-width:900px){
 .rc-header-inner{width:calc(100% - 46px)}
 .rc-topline{left:48px;right:48px}
 .rc-rail{display:none}
 .rc-monitor{width:min(48vw,460px)}
 .rc-site-heading strong{font-size:22px}
 .rc-site-cover-caption strong{font-size:3vw}
 .rc-headline{left:7%;width:52%}
 .rc-headline h1{font-size:clamp(46px,6.5vw,71px)}
 .rc-book{width:clamp(140px,18vw,175px)}
 .rc-progress-area{left:48px;right:48px}
}
@media(max-width:740px){
 .rc-header{height:67px}.rc-header-inner{width:calc(100% - 36px)}
 .rc-lockup{gap:13px}.rc-gcb-logo{font-size:13px}.rc-cross{font-size:21px}.rc-reizu-logo{font-size:15px}
 .rc-header nav{gap:0}.rc-nav-back{display:none}.rc-header nav .rc-nav-skip{font-size:10px}
 .rc-topline{left:22px;right:22px;top:calc(67px + 22px)}
 .rc-topline-index{display:none}.rc-eyebrow{font-size:9px}
 .rc-story{height:480svh}
 .rc-stage{min-height:540px}
 .rc-paper-grid{background-size:60px 60px}
 .rc-monitor{width:min(77vw,350px);top:44%}
 .rc-monitor-frame{padding:7px;border-radius:10px 10px 7px 7px}
 .rc-fake-browser{height:18px;padding:0 8px}
 .rc-fake-site{height:calc(100% - 18px)}
 .rc-site-heading{padding-bottom:4px}
 .rc-site-heading strong{font-size:clamp(14px,4vw,21px)}
 .rc-site-heading span{font-size:6px}
 .rc-site-cover{margin-top:5px}
 .rc-site-cover-caption strong{font-size:clamp(13px,4vw,22px)}
 .rc-site-bottom{height:17px;font-size:5.5px}
 .rc-monitor-neck{height:23px}.rc-monitor-base{height:7px}
 .rc-floating-sheet{height:clamp(140px,23vh,185px);top:40%}
 .rc-book{width:clamp(134px,39vw,194px);top:34%}
 .rc-cover-title{padding:11px 9px 8px 11px;bottom:20px}
 .rc-cover-title strong{font-size:clamp(20px,5.4vw,29px)}
 .rc-cover-title span{font-size:6px;margin-bottom:4px}
 .rc-cover-bottom{height:20px;font-size:5.5px}
 .rc-book-spine span{font-size:8px}
 .rc-headline{left:7%;right:7%;width:auto;top:58%;text-align:left}
 .rc-headline-label{font-size:8px;gap:9px;white-space:normal}.rc-red-dash{width:22px;height:3px;flex:none}
 .rc-headline h1{font-size:clamp(41px,10.7vw,68px);margin:13px 0 9px;line-height:1.04}
 .rc-headline p{font-size:12px;line-height:1.6;max-width:350px;margin-bottom:14px}
 .rc-action{min-height:43px;font-size:10px;padding:0 15px;gap:25px}
 .rc-progress-area{left:22px;right:22px;bottom:24px}
 .rc-scroll-instruction{font-size:8px;letter-spacing:.07em;gap:9px}.rc-scroll-arrow{font-size:18px}
 .rc-step-indicator{font-size:12px}
}
@media(max-width:390px){.rc-header nav .rc-nav-skip{font-size:9px}.rc-headline{top:56%}.rc-headline p{max-width:290px}.rc-headline h1{font-size:39px}.rc-scroll-word{max-width:170px}}
@media(max-height:680px) and (min-width:741px){.rc-headline{top:34%}.rc-headline h1{font-size:clamp(45px,5vw,75px);margin:15px 0}.rc-headline p{margin-bottom:14px}.rc-monitor{width:min(36vw,420px)}.rc-book{width:clamp(135px,13vw,184px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.rc-scroll-arrow{animation:none}*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

/* Fotografía real de la plataforma y portada proporcionada para la colaboración. */
.rc-monitor-capture{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center top;
  background:#fff;
}
.rc-sheet-cover{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:#fff;
}
.rc-book-cover-image{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:#fff;
}


/* Frase editorial que acompaña la computadora y desaparece al salir la portada. */
.rc-origin-caption{
  position:absolute;
  z-index:3;
  left:50%;
  top:76%;
  width:min(95vw,590px);
  margin:0;
  text-align:center;
  pointer-events:none;
  transform:translate(-50%,0);
  transform-origin:center top;
  will-change:opacity;
  -webkit-font-smoothing:antialiased;
  backface-visibility:visible;
}
.rc-origin-caption-inner{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  gap:5px;
  animation:rc-origin-enter .95s cubic-bezier(.22,.75,.23,1) both;
}
.rc-origin-eyebrow{
  font:800 9px/1.5 var(--sans);
  letter-spacing:.19em;
  color:#77746e;
}
.rc-origin-caption strong{
  font:400 clamp(22px,2.35vw,32px)/1.35 var(--serif);
  letter-spacing:-.045em;
  white-space:nowrap;
}
.rc-origin-caption em{font-weight:400;color:var(--red)}
.rc-origin-underline{
  width:24px;
  height:2px;
  background:var(--red);
  margin-top:7px;
}
@keyframes rc-origin-enter{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}
@media(max-width:740px){
  .rc-origin-caption{top:66%;width:91vw}
  .rc-origin-eyebrow{font-size:8px}
  .rc-origin-caption strong{font-size:clamp(21px,5.7vw,29px)}
}
@media(prefers-reduced-motion:reduce){
  .rc-origin-caption-inner{animation:none}
}