/* ============================================================
   R1 (Residência) — Tabs / Funcionalidades do ecossistema
   Layout-ref: OFT tabs · Design System: MED-Review R1
   Copper + deep violet · Orbitron + Exo 2 · constellation motif
   ============================================================ */
.r1-tabs{
  --cop-200:#F4DCC9;--cop-300:#E6C5A8;--cop-400:#D5A881;--cop-500:#B07764;--cop-600:#8A4B40;--cop-700:#64302C;
  --vio-950:#050310;--vio-900:#090413;--vio-850:#0D0B1F;--vio-800:#100F26;--vio-700:#1A1733;--vio-600:#2C2240;--vio-500:#403350;
  --fg:#F4EFE8;--fg-muted:#BFB8D0;--fg-subtle:#A094BA;--fg-faint:#7A6F95;
  --grad-copper:linear-gradient(135deg,#64302C 0%,#B07764 35%,#E6C5A8 65%,#FCEAE2 100%);
  --font-display:"Orbitron","Eurostile","Bahnschrift",system-ui,sans-serif;
  --font-body:"Exo 2","Inter",system-ui,-apple-system,sans-serif;
  --ease-out:cubic-bezier(.22,1,.36,1);
  --tab-surface:#1A1733;

  position:relative;display:block;
  padding:clamp(64px,8vw,104px) 24px;
  background:#111111;
  font-family:var(--font-body);
  isolation:isolate;overflow:hidden;
  -webkit-font-smoothing:antialiased;
}
/* Brilho ambiente — centralizado no meio, recuado das bordas (sem emenda no topo/base) */
.r1-tabs::before{
  content:"";position:absolute;left:0;right:0;top:15%;bottom:16%;z-index:0;pointer-events:none;
  background:
    radial-gradient(62% 58% at 50% 46%,rgba(213,168,129,.13) 0%,transparent 66%),
    radial-gradient(48% 52% at 62% 56%,rgba(64,51,80,.32) 0%,transparent 68%);
}
.r1-tabs,.r1-tabs *,.r1-tabs *::before,.r1-tabs *::after{box-sizing:border-box}
.r1-tabs a,.r1-tabs a:hover,.r1-tabs a:focus,.r1-tabs a:visited{text-decoration:none!important}
.r1-tabs button{font-family:inherit}
.r1-tabs img,.r1-tabs video{display:block;max-width:100%}

/* ─── HEADER ─── */
.r1-tabs__container{position:relative;z-index:1;max-width:1180px;margin:0 auto}
.r1-tabs__header{text-align:center;margin-bottom:44px}
.r1-tabs h2.r1-tabs__heading{
  font-family:var(--font-display)!important;
  font-size:36px!important;font-weight:400!important;line-height:1.18!important;letter-spacing:.01em!important;
  color:var(--fg)!important;-webkit-text-fill-color:var(--fg)!important;
  margin:0 auto 14px!important;max-width:24ch;text-wrap:balance;text-align:center!important;
}
.r1-tabs__heading-accent{
  background:var(--grad-copper);-webkit-background-clip:text;background-clip:text;
  color:transparent!important;-webkit-text-fill-color:transparent!important;
}
.r1-tabs p.r1-tabs__subtitle{
  font-family:var(--font-body)!important;
  font-size:17px!important;font-weight:400!important;line-height:1.55!important;
  color:var(--fg-muted)!important;-webkit-text-fill-color:var(--fg-muted)!important;
  margin:0 auto!important;max-width:60ch;text-wrap:balance;text-align:center!important;
}

/* ─── SWIPE HINT (mobile only) ─── */
.r1-tabs__swipe{display:none}

/* ─── TABLIST (folder tabs) ─── */
.r1-tabs__tablist{
  position:relative;display:flex;justify-content:center;align-items:flex-end;gap:2px;
  margin:0;padding:0 16px;list-style:none;flex-wrap:nowrap;
  overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
}
.r1-tabs__tablist::-webkit-scrollbar{display:none}
.r1-tabs__indicator{
  position:absolute;bottom:0;left:0;height:2px;width:0;
  background:linear-gradient(90deg,transparent 0%,var(--cop-400) 18%,var(--cop-300) 50%,var(--cop-400) 82%,transparent 100%);
  transform:translateX(0);
  transition:transform .42s cubic-bezier(.25,1.2,.5,1),width .42s cubic-bezier(.25,1.2,.5,1);
  pointer-events:none;z-index:1;opacity:.9;
}
.r1-tabs__tab{
  flex-shrink:0;display:inline-flex;align-items:center;gap:9px;
  padding:16px 22px 18px;background:transparent;border:none;border-radius:16px 16px 0 0;
  cursor:pointer;position:relative;white-space:nowrap;outline:none;
  transition:background .28s var(--ease-out),transform .22s var(--ease-out);
}
.r1-tabs__tab-num{
  font-family:var(--font-display);font-size:11px;font-weight:600;letter-spacing:.16em;
  color:var(--cop-500);opacity:.8;transition:color .24s ease,opacity .24s ease;
}
.r1-tabs__tab h3.r1-tabs__tab-label{
  font-family:var(--font-body);font-size:15px;font-weight:600;letter-spacing:.01em;line-height:1;
  color:var(--fg-subtle);transition:color .24s ease;margin:0;
}
.r1-tabs__tab:hover{background:rgba(213,168,129,.06);transform:translateY(-2px)}
.r1-tabs__tab:hover h3.r1-tabs__tab-label,.r1-tabs__tab:hover .r1-tabs__tab-num{color:var(--fg);opacity:1}
.r1-tabs__tab:focus-visible{outline:2px solid var(--cop-400);outline-offset:2px}
.r1-tabs__tab[aria-selected=true]{
  background:var(--tab-surface);border-radius:16px 16px 0 0;
  box-shadow:inset 0 2px 0 var(--cop-400);margin-bottom:-1px;z-index:3;transform:none;
}
.r1-tabs__tab[aria-selected=true] h3.r1-tabs__tab-label{color:var(--fg)}
.r1-tabs__tab[aria-selected=true] .r1-tabs__tab-num{color:var(--cop-300);opacity:1}
/* folder-merge rounded corners */
.r1-tabs__tab[aria-selected=true]::before,.r1-tabs__tab[aria-selected=true]::after{
  content:"";position:absolute;bottom:0;width:16px;height:16px;background:var(--tab-surface);pointer-events:none;
}
.r1-tabs__tab[aria-selected=true]::before{left:-16px;-webkit-mask-image:radial-gradient(circle 16px at 0 0,transparent 0 16px,#000 17px);mask-image:radial-gradient(circle 16px at 0 0,transparent 0 16px,#000 17px)}
.r1-tabs__tab[aria-selected=true]::after{right:-16px;-webkit-mask-image:radial-gradient(circle 16px at 100% 0,transparent 0 16px,#000 17px);mask-image:radial-gradient(circle 16px at 100% 0,transparent 0 16px,#000 17px)}
.r1-tabs__tab-node{
  display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--cop-500);margin-left:2px;
  box-shadow:0 0 0 0 rgba(213,168,129,.5);animation:r1-node-pulse 2.6s ease-in-out infinite!important;
}
.r1-tabs__tab[aria-selected=true] .r1-tabs__tab-node{background:var(--cop-300)}
@keyframes r1-node-pulse{0%,100%{box-shadow:0 0 0 0 rgba(213,168,129,.5)}50%{box-shadow:0 0 0 5px rgba(213,168,129,0)}}

/* ─── PANEL WRAP ─── */
.r1-tabs__panel-wrap{
  position:relative;z-index:1;background:var(--tab-surface);
  border:1px solid rgba(213,168,129,.16);border-top:0;border-radius:20px;overflow:hidden;
  box-shadow:0 40px 80px rgba(5,3,16,.5),0 12px 24px rgba(5,3,16,.32);
}
.r1-tabs__panel-wrap::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(circle at 82% 8%,rgba(213,168,129,.12),transparent 48%),
    radial-gradient(circle at 12% 100%,rgba(138,75,64,.14),transparent 46%);
}
.r1-tabs__cursor-glow{
  position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s ease;z-index:1;
  background:radial-gradient(circle 360px at var(--glow-x,50%) var(--glow-y,50%),rgba(213,168,129,.16) 0%,rgba(213,168,129,.05) 32%,transparent 62%);
  mix-blend-mode:screen;
}

/* ─── PANEL ─── */
.r1-tabs__panel{
  display:grid;grid-template-columns:minmax(0,0.72fr) minmax(0,1.4fr);gap:40px;padding:40px;
  position:relative;z-index:2;
}
.r1-tabs__panel--hidden{display:none}
.r1-tabs__panel--enter .r1-tabs__eyebrow,
.r1-tabs__panel--enter .r1-tabs__panel-title,
.r1-tabs__panel--enter .r1-tabs__panel-desc,
.r1-tabs__panel--enter .r1-tabs__media{
  opacity:0;transform:translateY(10px);animation:r1-stagger .5s var(--ease-out) forwards;
}
.r1-tabs__panel--enter .r1-tabs__eyebrow{animation-delay:80ms}
.r1-tabs__panel--enter .r1-tabs__panel-title{animation-delay:.15s}
.r1-tabs__panel--enter .r1-tabs__panel-desc{animation-delay:.22s}
.r1-tabs__panel--enter .r1-tabs__media{animation-delay:.1s}
@keyframes r1-stagger{to{opacity:1;transform:translateY(0)}}

.r1-tabs__copy{display:flex;flex-direction:column;justify-content:center}
.r1-tabs__copy h3.r1-tabs__eyebrow{
  display:flex;align-items:center;gap:10px;
  font-family:var(--font-display);font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cop-400);margin:0 0 14px;
}
.r1-tabs__copy h3.r1-tabs__eyebrow::before{content:"";width:24px;height:1px;background:var(--cop-400);flex-shrink:0}
.r1-tabs__copy h3.r1-tabs__panel-title{
  font-family:var(--font-body);font-size:26px;font-weight:700;line-height:1.22;letter-spacing:.005em;
  color:var(--fg);margin:0 0 16px;text-wrap:balance;
}
.r1-tabs__copy p.r1-tabs__panel-desc{
  font-family:var(--font-body);font-size:16px;line-height:1.62;font-weight:400;color:var(--fg-muted);margin:0;
}
.r1-tabs__desc-sm{display:none}  /* versão curta só aparece no mobile */

/* ─── MEDIA ─── */
.r1-tabs__media{
  position:relative;aspect-ratio:16 / 9;border-radius:14px;overflow:hidden;
  background:var(--vio-900);border:1px solid rgba(255,255,255,.06);
  box-shadow:0 14px 34px rgba(5,3,16,.55);transition:transform .32s var(--ease-out);
}
.r1-tabs__media:hover{transform:scale(1.015)}
.r1-tabs__media video,.r1-tabs__media img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.r1-tabs__media--image{background:transparent;border:none;box-shadow:none;overflow:visible;transition:transform .32s var(--ease-out)}
.r1-tabs__media--image:hover{transform:scale(1.03)}
.r1-tabs__media--image img{
  object-fit:contain;border-radius:12px;
  filter:drop-shadow(0 18px 32px rgba(5,3,16,.55)) drop-shadow(0 0 12px rgba(213,168,129,.12));
  animation:r1-float 4.8s cubic-bezier(.45,0,.55,1) infinite!important;will-change:transform;
}
@keyframes r1-float{0%,100%{transform:translateZ(0)}50%{transform:translate3d(0,-16px,0)}}

.r1-tabs__demo-badge{
  position:absolute;top:12px;right:12px;display:inline-flex;align-items:center;gap:6px;
  padding:5px 11px 5px 9px;background:rgba(9,4,19,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(213,168,129,.28);border-radius:999px;
  font-family:var(--font-body);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cop-200);
  z-index:2;pointer-events:none;user-select:none;-webkit-user-select:none;
}
.r1-tabs__demo-dot{width:7px;height:7px;border-radius:50%;background:var(--cop-300);box-shadow:0 0 0 0 rgba(230,197,168,.6);animation:r1-rec 1.6s ease-in-out infinite}
@keyframes r1-rec{0%,100%{box-shadow:0 0 0 0 rgba(230,197,168,.55)}50%{box-shadow:0 0 0 6px rgba(230,197,168,0)}}

/* ─── CONSTELLATION TRAIL (bottom decoration) ─── */
.r1-tabs__trail-wrap{position:absolute;left:0;right:0;bottom:0;height:46px;pointer-events:none;z-index:1;opacity:.5}
.r1-tabs__trail{width:100%;height:100%;color:var(--cop-400)}
.r1-tabs__trail-line{stroke-dasharray:900;stroke-dashoffset:900;animation:r1-trail 7s linear infinite}
.r1-tabs__trail-node{fill:var(--cop-300);opacity:.9}
@keyframes r1-trail{0%{stroke-dashoffset:900}100%{stroke-dashoffset:-900}}

/* ─── CONNECTOR (mobile only) ─── */
.r1-tabs__connector{display:none}

/* ─── RESPONSIVE ─── */
@media (max-width:900px){
  .r1-tabs{padding:56px 16px 72px}
  .r1-tabs h2.r1-tabs__heading{font-size:26px!important;max-width:18ch}
  .r1-tabs p.r1-tabs__subtitle{font-size:14px!important;max-width:36ch}
  .r1-tabs__header{margin-bottom:22px}

  .r1-tabs__swipe{display:none}

  .r1-tabs__tablist,.r1-tabs__indicator{display:none}
  .r1-tabs__panel-wrap{background:transparent;box-shadow:none;border:none;overflow:visible;border-radius:0}
  .r1-tabs__panel-wrap::before,.r1-tabs__cursor-glow,.r1-tabs__trail-wrap{display:none}

  .r1-tabs__panel{
    display:flex!important;flex-direction:column;gap:14px;padding:20px;
    background:var(--tab-surface);border-radius:16px;border:1px solid rgba(213,168,129,.16);position:relative;
    box-shadow:0 14px 30px rgba(5,3,16,.4);
  }
  .r1-tabs__panel--hidden{display:flex!important}
  .r1-tabs__panel--enter *{animation:none!important;opacity:1!important;transform:none!important}
  .r1-tabs__copy{display:contents}
  /* Mobile: só eyebrow (título da aba) > mídia > descrição curta. Título do card sai. */
  .r1-tabs__copy h3.r1-tabs__eyebrow{order:0;margin:0 0 2px;font-size:13px;letter-spacing:.12em}
  .r1-tabs__copy h3.r1-tabs__panel-title{display:none}
  .r1-tabs__panel>*{min-width:0;max-width:100%}
  .r1-tabs__media{order:1;margin:2px 0;aspect-ratio:16 / 10;border-radius:12px;width:100%;min-width:0}
  .r1-tabs__media video,.r1-tabs__media img{max-width:100%}
  .r1-tabs__media--image{aspect-ratio:16 / 10}
  .r1-tabs__media--image img{height:100%}
  .r1-tabs__copy p.r1-tabs__panel-desc{order:2;margin:0;font-size:14px;line-height:1.5}
  .r1-tabs__desc-lg{display:none}
  .r1-tabs__desc-sm{display:inline}

  /* Progressão de cor dos cards (01 → 05): gradiente claro em direção ao roxo R1.
     Apenas no mobile; no desktop as abas/painéis mantêm a MESMA cor (var(--tab-surface)). */
  .r1-tabs__panel{border-top:3px solid var(--cop-400)}
  .r1-tabs__panel[data-feature=flow]     {background:linear-gradient(180deg,#1C1838,#15122B)}
  .r1-tabs__panel[data-feature=simulados]{background:linear-gradient(180deg,#262048,#1D1838)}
  .r1-tabs__panel[data-feature=gabarito] {background:linear-gradient(180deg,#302858,#251F46)}
  .r1-tabs__panel[data-feature=apostilas]{background:linear-gradient(180deg,#3A3168,#2D2653)}
  .r1-tabs__panel[data-feature=forum]    {background:linear-gradient(180deg,#443A7A,#352E63)}

  /* browser chrome on video tabs */
  .r1-tabs__panel[data-feature=flow] .r1-tabs__media--video,
  .r1-tabs__panel[data-feature=simulados] .r1-tabs__media--video,
  .r1-tabs__panel[data-feature=gabarito] .r1-tabs__media--video{padding-top:26px;background:#14111f;aspect-ratio:auto}
  .r1-tabs__panel[data-feature=flow] .r1-tabs__media--video::before,
  .r1-tabs__panel[data-feature=simulados] .r1-tabs__media--video::before,
  .r1-tabs__panel[data-feature=gabarito] .r1-tabs__media--video::before{
    content:"";position:absolute;top:0;left:0;right:0;height:26px;z-index:1;
    background:radial-gradient(circle at 12px 13px,#ff5f56 4.5px,transparent 5px),radial-gradient(circle at 28px 13px,#ffbd2e 4.5px,transparent 5px),radial-gradient(circle at 44px 13px,#27c93f 4.5px,transparent 5px),linear-gradient(180deg,#231f3a,#1a1733);
    border-bottom:1px solid rgba(255,255,255,.06);
  }
  .r1-tabs__panel[data-feature=flow] .r1-tabs__media--video::after,
  .r1-tabs__panel[data-feature=simulados] .r1-tabs__media--video::after,
  .r1-tabs__panel[data-feature=gabarito] .r1-tabs__media--video::after{
    position:absolute;top:6px;left:62px;right:14px;height:14px;background:rgba(5,3,16,.5);border-radius:4px;
    color:rgba(244,239,232,.55);font-size:9.5px;font-family:var(--font-body);line-height:14px;padding:0 8px;
    overflow:hidden;white-space:nowrap;z-index:1;
  }
  .r1-tabs__panel[data-feature=flow] .r1-tabs__media--video::after{content:"app.medreview.com.br/flow"}
  .r1-tabs__panel[data-feature=simulados] .r1-tabs__media--video::after{content:"app.medreview.com.br/simulados"}
  .r1-tabs__panel[data-feature=gabarito] .r1-tabs__media--video::after{content:"app.medreview.com.br/gabarito"}
  .r1-tabs__panel[data-feature=flow] .r1-tabs__demo-badge,
  .r1-tabs__panel[data-feature=simulados] .r1-tabs__demo-badge,
  .r1-tabs__panel[data-feature=gabarito] .r1-tabs__demo-badge{top:34px}

  /* connectors between stacked cards (constellation) */
  .r1-tabs__connector{display:flex;flex-direction:column;align-items:center;gap:4px;margin:2px 0;height:30px;pointer-events:none}
  .r1-tabs__connector-line{width:2px;flex:1;background:linear-gradient(180deg,var(--cop-400),var(--cop-600) 50%,var(--cop-400));border-radius:2px;box-shadow:0 0 8px rgba(213,168,129,.4)}
  .r1-tabs__connector-node{width:9px;height:9px;border-radius:50%;background:var(--cop-300);box-shadow:0 0 10px rgba(230,197,168,.7);animation:r1-node-pulse 2.6s ease-in-out infinite}
}

@media (prefers-reduced-motion:reduce){
  .r1-tabs *,.r1-tabs *::before,.r1-tabs *::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}