/* 115 Studios / R3TCON Flagship Web Transition V1 */

:root {
  --r3tcon: #2ff7f2;
  --r3tcon-bright: #8ffffb;
  --r3tcon-deep: #082d34;
  --r3tcon-line: rgba(47,247,242,.24);
  --r3tcon-soft: rgba(47,247,242,.10);
}

.r3tcon-ambient .ambient-blue {
  opacity: .13;
  background: var(--r3tcon);
}
.r3tcon-ambient .ambient-pink { opacity: .025; }
.r3tcon-page {
  background:
    radial-gradient(circle at var(--pointer-x) var(--pointer-y), rgba(47,247,242,.055), transparent 34rem),
    #030708;
}
.r3tcon-signal-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 9px;
  border-radius: 50%;
  background: var(--r3tcon);
  box-shadow: 0 0 18px var(--r3tcon);
}
.r3tcon-primary {
  color: #021011;
  background: linear-gradient(110deg, #1fd7d3, var(--r3tcon-bright));
  box-shadow: 0 14px 52px rgba(47,247,242,.18);
}
.r3tcon-primary:hover { box-shadow: 0 18px 72px rgba(47,247,242,.27); }
.r3tcon-page h1 em,
.r3tcon-page h2 em { color: var(--r3tcon); }

.r3tcon-hero {
  min-height: 100svh;
  padding-top: calc(var(--header-h) + 70px);
  padding-bottom: 76px;
  display: grid;
  grid-template-columns: minmax(0,.88fr) minmax(480px,1.12fr);
  gap: clamp(42px,6vw,92px);
  align-items: center;
}
.r3tcon-hero-copy { position: relative; z-index: 4; }
.r3tcon-hero-copy h1 {
  margin-bottom: 30px;
  font-size: clamp(58px,6.2vw,98px);
}
.r3tcon-hero-lede {
  max-width: 680px;
  color: var(--paper-soft);
  font-size: clamp(18px,1.45vw,21px);
}
.r3tcon-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 28px;
}
.r3tcon-status-row span,
.r3tcon-file-tags span,
.r3tcon-evidence-tags span {
  padding: 7px 11px;
  border: 1px solid var(--r3tcon-line);
  border-radius: 999px;
  color: #9ac9ca;
  background: rgba(47,247,242,.035);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.r3tcon-hero-art {
  position: relative;
  min-width: 0;
  isolation: isolate;
}
.r3tcon-hero-frame {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(47,247,242,.18);
  border-radius: 34px;
  box-shadow: 0 36px 120px rgba(0,0,0,.54), 0 0 80px rgba(47,247,242,.055);
}
.r3tcon-hero-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 60%, rgba(3,7,8,.30));
  pointer-events: none;
}
.r3tcon-hero-frame img {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
}
.r3tcon-hero-mark {
  position: absolute;
  right: -3%;
  bottom: -10%;
  z-index: 3;
  width: min(28%,190px);
  aspect-ratio: 1;
  border-radius: 28%;
  box-shadow: 0 22px 70px rgba(0,0,0,.5), 0 0 48px rgba(47,247,242,.16);
}
.r3tcon-hero-mark img { width: 100%; border-radius: 25%; }
.r3tcon-hero-index {
  position: absolute;
  left: 22px;
  bottom: 18px;
  z-index: 3;
  color: rgba(255,255,255,.45);
  font-size: 9px;
  letter-spacing: .18em;
}
.r3tcon-problem,
.r3tcon-system,
.r3tcon-proof,
.r3tcon-evidence,
.r3tcon-file,
.r3tcon-branches,
.r3tcon-kickstarter {
  border-top: 1px solid var(--line);
}
.r3tcon-problem-grid {
  display: grid;
  grid-template-columns: 1fr .78fr;
  gap: clamp(44px,8vw,120px);
  align-items: start;
}
.r3tcon-problem-grid p {
  margin-top: 0;
  color: var(--paper-soft);
  font-size: 18px;
}
.r3tcon-capability-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}
.r3tcon-capability-grid article {
  min-height: 300px;
  padding: 30px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: linear-gradient(150deg, rgba(47,247,242,.025), transparent 65%);
}
.r3tcon-capability-grid article > span {
  color: var(--r3tcon);
  font-size: 10px;
  letter-spacing: .18em;
}
.r3tcon-capability-grid h3 { margin-top: 70px; }
.r3tcon-capability-grid p { color: var(--paper-soft); }

.r3tcon-shot-grid {
  display: grid;
  grid-template-columns: 1.3fr .7fr;
  gap: 18px;
  align-items: start;
}
.r3tcon-shot {
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(47,247,242,.13);
  border-radius: 26px;
  background: #05090b;
  box-shadow: 0 24px 90px rgba(0,0,0,.28);
}
.r3tcon-shot-wide:first-child { grid-column: 1; }
.r3tcon-shot-tall { grid-column: 2; grid-row: span 2; }
.r3tcon-shot-wide:last-child { grid-column: 1; }
.r3tcon-shot img { width: 100%; height: auto; }
.r3tcon-shot figcaption {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  padding: 18px 20px 20px;
  border-top: 1px solid var(--line);
}
.r3tcon-shot figcaption span {
  color: var(--r3tcon);
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.r3tcon-shot figcaption b {
  color: var(--paper-soft);
  font-size: 12px;
  font-weight: 600;
  text-align: right;
}
.r3tcon-video-grid {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: 18px;
  margin-top: 18px;
}
.r3tcon-video-card {
  min-width: 0;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 26px;
  background: rgba(8,14,16,.66);
}
.r3tcon-video-card video {
  width: 100%;
  max-height: 700px;
  margin: 14px 0 22px;
  border-radius: 18px;
  background: #000;
}
.r3tcon-video-card:first-child video {
  aspect-ratio: 9/14.4;
  object-fit: contain;
}
.r3tcon-video-card:last-child video {
  aspect-ratio: 16/10;
  object-fit: contain;
}
.r3tcon-video-meta {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  color: #7aa4a5;
  font-size: 9px;
  letter-spacing: .13em;
}
.r3tcon-video-card h3 { margin-bottom: 10px; }
.r3tcon-video-card p { color: var(--paper-soft); }

.r3tcon-evidence-grid,
.r3tcon-branches {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: clamp(44px,8vw,120px);
  align-items: start;
}
.r3tcon-evidence-copy p,
.r3tcon-branches > p {
  margin-top: 0;
  color: var(--paper-soft);
  font-size: 19px;
}
.r3tcon-evidence-tags,
.r3tcon-file-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 28px;
}
.r3tcon-file-card {
  display: grid;
  grid-template-columns: .48fr 1.2fr;
  gap: clamp(40px,7vw,100px);
  align-items: center;
  padding: clamp(34px,6vw,74px);
  border: 1px solid var(--r3tcon-line);
  border-radius: 34px;
  background:
    radial-gradient(circle at 15% 50%, rgba(47,247,242,.11), transparent 34%),
    linear-gradient(140deg, rgba(47,247,242,.035), rgba(255,255,255,.015));
}
.r3tcon-file-icon {
  display: grid;
  place-items: center;
  min-height: 280px;
  border: 1px solid rgba(47,247,242,.28);
  border-radius: 30px;
  background: rgba(0,0,0,.25);
  box-shadow: inset 0 0 90px rgba(47,247,242,.04), 0 30px 80px rgba(0,0,0,.24);
}
.r3tcon-file-icon span {
  color: var(--r3tcon);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: clamp(58px,8vw,110px);
  letter-spacing: -.08em;
  text-shadow: 0 0 38px rgba(47,247,242,.24);
}
.r3tcon-file-card p { color: var(--paper-soft); font-size: 18px; }
.r3tcon-file-card strong { color: var(--r3tcon-bright); }

.r3tcon-branches {
  min-height: 500px;
  align-items: center;
}
.r3tcon-branches h2 { margin-bottom: 0; }

.r3tcon-kickstarter {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: .58fr 1fr;
  gap: clamp(38px,7vw,90px);
  align-items: center;
}
.r3tcon-kickstarter-art {
  position: relative;
  width: min(100%,420px);
  aspect-ratio: 1;
  margin-inline: auto;
}
.r3tcon-kickstarter-art::before,
.r3tcon-kickstarter-art::after {
  content: "";
  position: absolute;
  inset: 4%;
  border: 1px solid rgba(47,247,242,.22);
  border-radius: 50%;
}
.r3tcon-kickstarter-art::before { transform: rotate(-15deg) scale(1,.72); }
.r3tcon-kickstarter-art::after { transform: rotate(17deg) scale(.82,1); }
.r3tcon-kickstarter-art img {
  position: absolute;
  z-index: 2;
  inset: 20%;
  width: 60%;
  border-radius: 25%;
  filter: drop-shadow(0 24px 70px rgba(47,247,242,.18));
}
.r3tcon-kickstarter-copy { max-width: 740px; }
.r3tcon-kickstarter-copy p:not(.eyebrow) { color: var(--paper-soft); font-size: 18px; }
.r3tcon-availability { border-top-color: rgba(47,247,242,.18); }

.r3tcon-flagship {
  border-color: rgba(47,247,242,.22);
  box-shadow: 0 28px 110px rgba(0,0,0,.28), 0 0 80px rgba(47,247,242,.035);
}
.r3tcon-flagship .project-tagline { color: var(--r3tcon); }
.r3tcon-flagship-visual {
  background: #03090a;
}
.r3tcon-flagship-visual::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(3,9,10,.03), rgba(3,9,10,.38));
  pointer-events: none;
}
.r3tcon-flagship-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.r3tcon-flagship-visual .flagship-label {
  border-color: rgba(47,247,242,.35);
}
.r3tcon-flagship-icon {
  position: absolute;
  z-index: 3;
  right: 30px;
  bottom: 30px;
  width: min(30%,180px);
  border-radius: 25%;
  box-shadow: 0 20px 60px rgba(0,0,0,.48), 0 0 42px rgba(47,247,242,.18);
}
.r3tcon-flagship .project-meta span {
  border-color: rgba(47,247,242,.18);
}
.product-icon-card-pulse {
  background:
    radial-gradient(circle at 74% 6%, rgba(255,75,141,.12), transparent 36%),
    linear-gradient(155deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
}
.product-icon-card-pulse .product-card-state {
  border-color: rgba(255,75,141,.26);
  color: #ff9dc2;
  background: rgba(18,5,12,.76);
}
.product-icon-card-pulse .product-icon-arrow { color: var(--pink); }

@media (max-width: 980px) {
  .r3tcon-hero { grid-template-columns: 1fr; min-height: auto; padding-top: calc(var(--header-h) + 110px); }
  .r3tcon-hero-art { width: 100%; }
  .r3tcon-problem-grid,
  .r3tcon-evidence-grid,
  .r3tcon-branches,
  .r3tcon-kickstarter,
  .r3tcon-file-card { grid-template-columns: 1fr; }
  .r3tcon-capability-grid { grid-template-columns: repeat(2,1fr); }
  .r3tcon-video-grid { grid-template-columns: 1fr; }
  .r3tcon-video-card:first-child video { max-height: 760px; }
}
@media (max-width: 720px) {
  .r3tcon-hero { gap: 34px; }
  .r3tcon-hero-copy h1 { font-size: clamp(52px,16vw,78px); }
  .r3tcon-hero-mark { width: 24%; right: 4%; bottom: -8%; }
  .r3tcon-capability-grid { grid-template-columns: 1fr; }
  .r3tcon-capability-grid article { min-height: 240px; }
  .r3tcon-capability-grid h3 { margin-top: 42px; }
  .r3tcon-shot-grid { grid-template-columns: 1fr; }
  .r3tcon-shot-wide:first-child,
  .r3tcon-shot-tall,
  .r3tcon-shot-wide:last-child { grid-column: 1; grid-row: auto; }
  .r3tcon-shot figcaption { flex-direction: column; gap: 6px; }
  .r3tcon-shot figcaption b { text-align: left; }
  .r3tcon-file-icon { min-height: 200px; }
  .r3tcon-kickstarter-art { width: min(76vw,340px); }
}
@media (prefers-reduced-motion: reduce) {
  .r3tcon-primary,
  .r3tcon-hero-mark { transition: none; }
}