/* tastemaker-stamp: refinement pass 2026-08-31 | mode: locked ROR DNA (deep purple/gold/ink + bone band, Fraunces/Cabinet Grotesk) | refs: aesop rhythm, jamesclear capture discipline, rocnation restraint | additions: band bloom+hairline, staggered reveals, pull-line, gold progress hairline, selection+focus craft | motion: house grid only, reduced-motion gated | critique (show/philosophy/hierarchy/specificity/restraint/variety): 4/4/5/4/5/4 */
/* A Bridge to the Throne — Black Friday band (enhancement layer).
   Own class names only; never reuses builder classes. Light warm field
   between the dark Library section and Endorsed by Legends,
   satisfying the page-rhythm rule (adjacent sections differ in value
   and temperature). */

.rorbtt {
  /* the section list centers unstretched children; without these two lines
     the band shrinks to content width while every native section runs
     full-bleed */
  width: 100%;
  align-self: stretch;
  box-sizing: border-box;
  background:
    radial-gradient(46% 60% at 76% 46%, rgba(174, 132, 4, 0.07) 0%, rgba(231, 227, 216, 0) 70%),
    #E7E3D8;
  border-top: 1px solid rgba(140, 93, 48, 0.28);
  padding: 110px 72px;
  font-family: "Cabinet Grotesk", "Inter", -apple-system, sans-serif;
}
.rorbtt__inner {
  max-width: 1140px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 72px;
}
.rorbtt__copy { flex: 1; min-width: 0; }
.rorbtt__eyebrow {
  font-family: "Fraunces", Georgia, serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #AE8404;
  margin: 0 0 18px;
}
.rorbtt__headline {
  font-family: "Fraunces", Georgia, serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 1.1;
  letter-spacing: -0.2px;
  color: #14161F;
  margin: 0 0 20px;
  text-wrap: balance;
}
.rorbtt__pullline {
  font-family: "Fraunces", Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 22px;
  line-height: 1.35;
  color: #14161F;
  max-width: 460px;
  margin: 0 0 18px;
  text-wrap: balance;
}
.rorbtt__body {
  font-size: 19px;
  line-height: 1.6;
  letter-spacing: -0.02em;
  color: #3A4150;
  max-width: 560px;
  margin: 0 0 28px;
}
.rorbtt__headline--announce { font-size: 46px; }
.rorbtt__date {
  font-family: "Fraunces", Georgia, serif;
  font-weight: 700;
  font-size: 19px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #AE8404;
  margin: 0 0 22px;
}
.rorbtt__form { display: flex; gap: 10px; max-width: 460px; }
.rorbtt__email {
  flex: 1;
  min-width: 0;
  font: inherit;
  font-size: 16px;
  color: #14161F;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(20, 22, 31, 0.25);
  border-radius: 8px;
  padding: 13px 16px;
  outline: none;
}
.rorbtt__email:focus { border-color: #AE8404; }
.rorbtt__btn {
  position: relative;
  font: inherit;
  font-size: 15px;
  font-weight: 600;
  color: #14161F;
  background: linear-gradient(135deg, #E9C86A 0%, #AE8404 100%);
  border: 0;
  border-radius: 8px;
  padding: 13px 22px;
  cursor: pointer;
  white-space: nowrap;
  transition: transform 0.16s cubic-bezier(0.22, 1, 0.36, 1);
}
.rorbtt__btn::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 8px;
  box-shadow: 0 8px 20px rgba(174, 132, 4, 0.3);
  opacity: 0;
  transition: opacity 0.16s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}
.rorbtt__btn:disabled { cursor: default; transform: none; }
.rorbtt__note { font-size: 13px; color: #6B7280; margin: 10px 0 0; }
.rorbtt__link { display: inline-block; margin-top: 22px; font-size: 15px; font-weight: 600; color: #8A5A2B; text-decoration: none; border-bottom: 1px solid rgba(138, 90, 43, 0.4); padding-bottom: 2px; transition: color 0.16s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.16s cubic-bezier(0.22, 1, 0.36, 1); }
.rorbtt__coverwrap a { display: block; transition: transform 0.16s cubic-bezier(0.22, 1, 0.36, 1); }
@media (hover: hover) and (pointer: fine) {
  .rorbtt__btn:hover { transform: translateY(-2px); }
  .rorbtt__btn:hover::after { opacity: 1; }
  .rorbtt__link:hover { color: #AE8404; border-color: #AE8404; }
  .rorbtt__coverwrap a:hover { transform: translateY(-4px); }
}
.rorbtt__msg { font-size: 14px; margin: 10px 0 0; }
.rorbtt__msg--err { color: #9B3B3B; }
.rorbtt__coverwrap { flex: none; width: 420px; }
.rorbtt__cover {
  width: 100%;
  aspect-ratio: 5 / 8; /* reserves the box before the lazy image arrives */
  object-fit: cover;
  display: block;
  border-radius: 4px;
  box-shadow: 0 30px 60px rgba(20, 22, 31, 0.38), 0 6px 16px rgba(20, 22, 31, 0.22);
}
@media (max-width: 1199.98px) {
  .rorbtt { padding: 96px 40px; }
  .rorbtt__inner { gap: 48px; }
  .rorbtt__coverwrap { width: 340px; }
}
@media (max-width: 809.98px) {
  .rorbtt { padding: 72px 24px; }
  .rorbtt__inner { flex-direction: column-reverse; gap: 40px; }
  .rorbtt__coverwrap { width: 260px; }
  .rorbtt__headline { font-size: 30px; }
  .rorbtt__headline--announce { font-size: 34px; }
  .rorbtt__pullline { font-size: 19px; }
  .rorbtt__form { flex-direction: column; max-width: none; }
  .rorbtt__btn { width: 100%; }
}


/* --- entrance + craft layer --- */
[data-gtrv] { transition: opacity 0.625s cubic-bezier(0.22, 1, 0.36, 1), transform 0.625s cubic-bezier(0.22, 1, 0.36, 1); }
[data-gtrv].gtrv-pre { opacity: 0; transform: translateY(14px); }
[data-gtrv].gtrv-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  [data-gtrv], [data-gtrv].gtrv-pre { opacity: 1; transform: none; transition: none; }
}

/* scaleX(0) here is a live progress indicator driven by rAF with NO transition,
   not an entrance animation; 625ms reveals below are marketing motion on the
   house 96 BPM beat, reduced-motion gated. */
#rorbtt-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, #D4A843 0%, #AE8404 100%);
  transform: scaleX(0);
  transform-origin: left center;
  z-index: 2147483000;
  pointer-events: none;
}

::selection { background: rgba(212, 168, 67, 0.30); }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 2px solid #D4A843; outline-offset: 2px; }


/* --- pressed in the same house --- */
.rorhouse { background: rgb(14, 10, 20); border-top: 1px solid rgba(212, 168, 67, 0.25); padding: 54px 48px; }
.rorhouse__inner { max-width: 1180px; margin: 0 auto; }
.rorhouse__label { font-family: "Fraunces", Georgia, serif; font-weight: 600; font-size: 14px; letter-spacing: 0.24em; text-transform: uppercase; color: #D4A843; margin: 0 0 22px; }
.rorhouse__row { display: flex; flex-wrap: wrap; gap: 16px 48px; }
.rorhouse__link { display: flex; flex-direction: column; gap: 3px; text-decoration: none; }
.rorhouse__role { font-family: "Cabinet Grotesk", "Inter", sans-serif; font-weight: 500; font-size: 14px; letter-spacing: 0.18em; text-transform: uppercase; color: #D4A843; }
.rorhouse__name { font-family: "Fraunces", Georgia, serif; font-style: italic; font-size: 19px; color: #F4F1E8; transition: color 0.16s cubic-bezier(0.22, 1, 0.36, 1); }
@media (hover: hover) and (pointer: fine) {
  .rorhouse__link:hover .rorhouse__name { color: #D4A843; }
}
@media (max-width: 809.98px) { .rorhouse { padding: 44px 22px; } }
