/* ═══════════════════════════════════════════════════════════
   research.phrevo.io — Stylesheet
   Standalone. No dependency on parent PHREVO site.
   ═══════════════════════════════════════════════════════════ */

/* ─── TOKENS ─────────────────────────────────────────────── */
:root {
  --navy:   #0d1b3e;
  --navy2:  #06101f;
  --navy3:  #020b17;
  --white:  #fff;
  --teal:   #4ecdc4;
  --teal2:  #7ee8e1;
  --copper: #b87c4e;
  --amber:  #e8a84e;
  --rule:   rgba(255,255,255,.08);
  --muted:  rgba(255,255,255,.52);
  --serif:  'Instrument Serif', Georgia, serif;
  --display:'Bebas Neue', 'Archivo', sans-serif;
  --sans:   'Archivo', -apple-system, sans-serif;
  --mono:   'JetBrains Mono', monospace;
}

/* ─── RESET ───────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth }
body {
  background: var(--navy3);
  color: var(--white);
  font-family: var(--sans);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.65;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
/* film grain */
body::after {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:9999; opacity:.022;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}
a { color:inherit; text-decoration:none }
img { display:block; max-width:100% }

/* ─── LANG ────────────────────────────────────────────────── */
[data-en],[data-es]                       { display:none }
body.en [data-en]                         { display:revert }
body.es [data-es]                         { display:revert }
body.en span[data-en],body.es span[data-es]{ display:inline }
body.en p[data-en],body.es p[data-es]     { display:block }
body.en div[data-en],body.es div[data-es] { display:block }
body.en li[data-en],body.es li[data-es]   { display:list-item }

/* ─── TOP BAR ─────────────────────────────────────────────── */
.topbar {
  position:fixed; top:0; left:0; right:0; z-index:900;
  height:64px; padding:0 2.5rem;
  display:flex; align-items:center; justify-content:space-between;
  transition:background .5s, backdrop-filter .5s;
}
.topbar.scrolled {
  background:rgba(2,11,23,.92);
  backdrop-filter:blur(24px);
  border-bottom:1px solid var(--rule);
}
.brand { display:flex; align-items:center; gap:.65rem }
.brand img { width:28px; height:28px; border-radius:50%; border:1px solid rgba(78,205,196,.3) }
.brand-word { font-family:var(--display); font-size:1.15rem; letter-spacing:.2em }
.brand-sub {
  font-family:var(--mono); font-size:.46rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--teal); opacity:.8;
  margin-left:.1rem; align-self:flex-end; padding-bottom:2px;
}
.nav-r { display:flex; align-items:center; gap:1rem }
.lang-toggle { display:flex; align-items:center; gap:.35rem }
.lang-toggle button {
  background:none; border:none; font-family:var(--mono);
  font-size:.52rem; letter-spacing:.18em; text-transform:uppercase;
  color:rgba(255,255,255,.3); cursor:pointer;
}
.lang-toggle button.on { color:var(--teal) }
.lang-toggle .sep { font-size:.42rem; opacity:.2 }
.topbar-cta {
  font-family:var(--mono); font-size:.52rem; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(255,255,255,.4); transition:color .2s;
}
.topbar-cta:hover { color:var(--teal) }

/* ─── BUTTONS ─────────────────────────────────────────────── */
.btn-solid {
  display:inline-flex; align-items:center; gap:.5rem;
  min-height:52px; padding:1.1rem 2.2rem;
  font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; font-weight:600;
  background:var(--teal); color:var(--navy);
  transition:background .25s, transform .22s, box-shadow .25s;
  position:relative; overflow:hidden;
}
.btn-solid:hover { background:var(--teal2); transform:translateY(-2px); box-shadow:0 12px 32px rgba(78,205,196,.25) }
.btn-ghost {
  display:inline-flex; align-items:center; gap:.5rem;
  min-height:52px; padding:1.1rem 2.2rem;
  font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; font-weight:500;
  border:1px solid rgba(255,255,255,.3); color:var(--white);
  transition:border-color .25s, color .25s, transform .22s;
}
.btn-ghost:hover { border-color:var(--teal); color:var(--teal); transform:translateY(-2px) }
.btn-sm {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.6rem 1.2rem; font-size:.5rem; letter-spacing:.18em; text-transform:uppercase;
  font-family:var(--mono); font-weight:500;
  background:rgba(78,205,196,.12); color:var(--teal);
  border:1px solid rgba(78,205,196,.25);
  transition:background .2s, border-color .2s;
}
.btn-sm:hover { background:rgba(78,205,196,.2); border-color:rgba(78,205,196,.5) }
.btn-sm.amber {
  background:rgba(232,168,78,.1); color:var(--amber);
  border-color:rgba(232,168,78,.25);
}
.btn-sm.amber:hover { background:rgba(232,168,78,.2); border-color:rgba(232,168,78,.5) }

/* ═══════════════════════════════════════════════════════════
   1. HERO
   ═══════════════════════════════════════════════════════════ */
.hero {
  position:relative;
  width:100%; min-height:100vh;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  overflow:hidden;
  padding-top:64px;
}
.hero-photo {
  position:absolute; inset:0;
  background-image:url('https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=1920&q=80');
  background-size:cover; background-position:center 30%;
  filter:saturate(.2) brightness(.35);
}
.hero-vignette {
  position:absolute; inset:0;
  background:
    radial-gradient(ellipse 70% 70% at 50% 45%, transparent 20%, rgba(2,11,23,.75) 100%),
    linear-gradient(to bottom, rgba(2,11,23,.4) 0%, transparent 25%, transparent 65%, rgba(2,11,23,.95) 100%);
}
#gridCanvas {
  position:absolute; inset:0; width:100%; height:100%;
  pointer-events:none; opacity:.5;
}
.hero-content {
  position:relative; z-index:2;
  text-align:center; padding:0 2rem; max-width:960px;
}
.hero-eyebrow {
  display:block;
  font-family:var(--mono); font-size:.52rem; letter-spacing:.36em; text-transform:uppercase;
  color:var(--teal); margin-bottom:2rem;
  opacity:0; animation:fade-up .6s .4s ease forwards;
}
.hero-title {
  font-family:var(--serif);
  font-size:clamp(3.5rem,9vw,10rem);
  font-weight:400; line-height:.9; letter-spacing:-.02em;
  margin-bottom:2rem;
}
.hero-title .word {
  display:inline-block; opacity:0; transform:translateY(28px);
  animation:word-in .7s ease forwards;
}
.hero-title em { font-style:italic; color:var(--teal) }
.hero-sub {
  font-size:clamp(.95rem,2vw,1.2rem);
  color:rgba(255,255,255,.7); max-width:640px; margin:0 auto 3rem;
  line-height:1.9;
  opacity:0; animation:fade-up .7s 1.1s ease forwards;
}
.hero-actions {
  display:flex; gap:1rem; justify-content:center; flex-wrap:wrap;
  opacity:0; animation:fade-up .6s 1.35s ease forwards;
}
.hero-meta {
  position:absolute; bottom:2.5rem; left:0; right:0;
  display:flex; justify-content:center; gap:3rem;
  opacity:0; animation:fade-up .5s 1.8s ease forwards;
}
.hero-stat {
  text-align:center;
}
.hero-stat-n {
  display:block; font-family:var(--display); font-size:2rem; letter-spacing:.05em;
  color:transparent; -webkit-text-stroke:1px rgba(78,205,196,.6); line-height:1;
}
.hero-stat-l {
  font-family:var(--mono); font-size:.44rem; letter-spacing:.2em;
  text-transform:uppercase; color:rgba(255,255,255,.35); margin-top:.25rem;
}
@keyframes word-in  { to { opacity:1; transform:none } }
@keyframes fade-up  { from { opacity:0; transform:translateY(18px) } to { opacity:1; transform:none } }

/* ═══════════════════════════════════════════════════════════
   2. SECTION COMMONS
   ═══════════════════════════════════════════════════════════ */
.sect-eyebrow {
  display:block; font-family:var(--mono); font-size:.52rem; letter-spacing:.28em;
  text-transform:uppercase; color:var(--teal); margin-bottom:1rem;
}
.sect-h {
  font-family:var(--serif); font-size:clamp(2rem,5vw,5rem);
  font-weight:400; line-height:.95; letter-spacing:-.02em; margin-bottom:.8rem;
}
.sect-h em { font-style:normal; color:var(--teal) }
.sect-lead { font-size:.95rem; color:var(--muted); line-height:1.9; max-width:600px }

/* ═══════════════════════════════════════════════════════════
   3. OPEN METHODOLOGY
   ═══════════════════════════════════════════════════════════ */
.method-sect {
  padding:8rem 2.5rem;
  border-top:1px solid var(--rule);
  position:relative; overflow:hidden;
}
.method-sect::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 55% 60% at 80% 50%, rgba(78,205,196,.04), transparent 70%);
  pointer-events:none;
}
.method-inner { max-width:1200px; margin:0 auto }
.method-top {
  display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center;
  margin-bottom:6rem;
}
.method-download {
  display:inline-flex; align-items:center; gap:.6rem; margin-top:2rem;
}
/* Framework grid */
.framework-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--rule); border:1px solid var(--rule);
  margin-top:4rem;
}
.fw-pillar {
  background:var(--navy2); padding:2.5rem 1.8rem;
  transition:background .28s;
}
.fw-pillar:hover { background:rgba(78,205,196,.03) }
.fw-pillar-n {
  font-family:var(--display); font-size:4rem;
  color:transparent; -webkit-text-stroke:1.5px rgba(78,205,196,.3);
  line-height:1; margin-bottom:.5rem;
}
.fw-pillar-title {
  font-family:var(--mono); font-size:.52rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--teal); display:block; margin-bottom:.6rem;
}
.fw-pillar-desc { font-size:.8rem; line-height:1.75; color:var(--muted) }
.fw-pillar-tags {
  display:flex; flex-wrap:wrap; gap:.3rem; margin-top:1rem;
}
.fw-tag {
  font-family:var(--mono); font-size:.42rem; letter-spacing:.12em;
  text-transform:uppercase; padding:.22rem .55rem;
  border:1px solid rgba(78,205,196,.2); color:rgba(78,205,196,.6);
}
/* KPI bar */
.kpi-bar {
  margin-top:4rem; padding:2.5rem;
  border:1px solid var(--rule); background:var(--navy2);
  display:flex; align-items:center; gap:3rem; flex-wrap:wrap;
}
.kpi-bar-item { text-align:center; flex:1; min-width:120px }
.kpi-n {
  display:block; font-family:var(--display);
  font-size:clamp(2.5rem,5vw,5rem); letter-spacing:-.01em;
  color:transparent; -webkit-text-stroke:1.5px var(--teal); line-height:1;
}
.kpi-label {
  font-family:var(--mono); font-size:.5rem; letter-spacing:.18em;
  text-transform:uppercase; color:rgba(255,255,255,.4); margin-top:.3rem; display:block;
}
.kpi-bar-divider { width:1px; height:60px; background:var(--rule); flex-shrink:0 }

/* ═══════════════════════════════════════════════════════════
   4. PAPERS & PUBLICATIONS
   ═══════════════════════════════════════════════════════════ */
.papers-sect {
  padding:8rem 2.5rem;
  border-top:1px solid var(--rule);
  background:var(--navy2);
}
.papers-inner { max-width:1200px; margin:0 auto }
.papers-header {
  display:flex; align-items:flex-end; justify-content:space-between;
  flex-wrap:wrap; gap:1.5rem; margin-bottom:3rem;
}
/* Filter tabs */
.filter-tabs {
  display:flex; gap:.3rem; flex-wrap:wrap; margin-bottom:3rem;
}
.filter-tab {
  font-family:var(--mono); font-size:.5rem; letter-spacing:.16em; text-transform:uppercase;
  padding:.55rem 1.1rem; background:none;
  border:1px solid rgba(255,255,255,.1); color:rgba(255,255,255,.45);
  cursor:pointer; transition:all .2s;
}
.filter-tab.active, .filter-tab:hover {
  border-color:var(--teal); color:var(--teal);
  background:rgba(78,205,196,.07);
}
/* Papers grid */
.papers-grid {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(320px,1fr)); gap:1px;
  background:var(--rule); border:1px solid var(--rule);
}
/* Compact card for annexes / reference docs */
.paper-card.compact { padding:1.4rem 1.8rem }
.paper-card.compact .paper-title { font-size:1rem }
.paper-card.compact .paper-abstract { -webkit-line-clamp:3 }
/* Annex list — horizontal strip layout */
.annex-list {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(260px,1fr)); gap:1px;
  background:var(--rule); border:1px solid var(--rule); margin-top:1px;
}
.annex-item {
  background:var(--navy2); padding:1.2rem 1.6rem;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  transition:background .2s;
}
.annex-item:hover { background:rgba(78,205,196,.03) }
.annex-item[data-hidden] { display:none }
.annex-label {
  font-family:var(--mono); font-size:.48rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--teal); display:block; margin-bottom:.2rem;
}
.annex-title { font-size:.84rem; line-height:1.5; color:rgba(255,255,255,.78) }
.paper-card {
  background:var(--navy2); padding:2.2rem;
  display:flex; flex-direction:column;
  transition:background .25s;
}
.paper-card:hover { background:rgba(78,205,196,.025) }
.paper-card[data-hidden] { display:none }
.paper-domain {
  display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:1.2rem;
}
.domain-tag {
  font-family:var(--mono); font-size:.42rem; letter-spacing:.12em; text-transform:uppercase;
  padding:.2rem .55rem; border:1px solid;
}
.domain-tag.framework  { border-color:rgba(78,205,196,.35); color:rgba(78,205,196,.75) }
.domain-tag.economy    { border-color:rgba(232,168,78,.35); color:rgba(232,168,78,.75) }
.domain-tag.governance { border-color:rgba(184,124,78,.35); color:rgba(184,124,78,.75) }
.domain-tag.field      { border-color:rgba(46,204,113,.35); color:rgba(46,204,113,.75) }
.domain-tag.methodology{ border-color:rgba(78,205,196,.35); color:rgba(78,205,196,.75) }
.paper-title {
  font-family:var(--serif); font-size:1.25rem; font-weight:400;
  line-height:1.3; margin-bottom:.7rem;
}
.paper-authors {
  font-family:var(--mono); font-size:.5rem; letter-spacing:.1em;
  color:var(--teal); margin-bottom:.9rem; opacity:.8;
}
.paper-abstract {
  font-size:.82rem; line-height:1.8; color:var(--muted);
  flex:1; margin-bottom:1.6rem;
  display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden;
}
.paper-meta {
  display:flex; align-items:center; justify-content:space-between;
  padding-top:1.2rem; border-top:1px solid var(--rule);
  gap:.8rem; flex-wrap:wrap;
}
.paper-year {
  font-family:var(--mono); font-size:.46rem; letter-spacing:.14em;
  color:rgba(255,255,255,.28); text-transform:uppercase;
}
.paper-actions { display:flex; gap:.5rem }
/* Coming soon placeholder card */
.paper-card.placeholder {
  border:1px dashed rgba(255,255,255,.08);
  align-items:center; justify-content:center;
  min-height:260px; text-align:center;
  background:rgba(78,205,196,.015);
}
.placeholder-icon {
  font-family:var(--mono); font-size:2.5rem; color:rgba(78,205,196,.15);
  display:block; margin-bottom:1rem; line-height:1;
}
.placeholder-text {
  font-family:var(--mono); font-size:.5rem; letter-spacing:.16em;
  text-transform:uppercase; color:rgba(255,255,255,.22);
}
/* Upload notice */
.papers-notice {
  margin-top:2.5rem; padding:1.4rem 2rem;
  border:1px solid rgba(78,205,196,.2); background:rgba(78,205,196,.04);
  display:flex; align-items:center; gap:1.2rem; flex-wrap:wrap;
}
.papers-notice-icon { font-size:1.4rem; flex-shrink:0 }
.papers-notice-text { font-size:.82rem; color:var(--muted); line-height:1.7 }
.papers-notice-text strong { color:var(--teal); font-weight:400 }

/* ═══════════════════════════════════════════════════════════
   5. DATASETS
   ═══════════════════════════════════════════════════════════ */
.data-sect {
  padding:8rem 2.5rem;
  border-top:1px solid var(--rule);
}
.data-inner { max-width:1200px; margin:0 auto }
.data-grid {
  display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:1px;
  background:var(--rule); border:1px solid var(--rule);
  margin-top:4rem;
}
.dataset-card {
  background:var(--navy3); padding:2.5rem 2rem;
  display:flex; flex-direction:column; gap:1rem;
  transition:background .25s;
}
.dataset-card:hover { background:rgba(78,205,196,.025) }
.dataset-status {
  display:inline-flex; align-items:center; gap:.4rem;
  font-family:var(--mono); font-size:.44rem; letter-spacing:.15em; text-transform:uppercase;
  width:fit-content;
}
.dataset-status.open { color:rgba(46,204,113,.85) }
.dataset-status.request { color:var(--amber) }
.dataset-status::before {
  content:''; display:block; width:6px; height:6px; border-radius:50%; flex-shrink:0;
  background:currentColor;
}
.dataset-n {
  font-family:var(--display); font-size:3.5rem; letter-spacing:-.01em;
  color:transparent; -webkit-text-stroke:1.5px rgba(78,205,196,.4); line-height:1;
}
.dataset-n.amber { -webkit-text-stroke-color:rgba(232,168,78,.4) }
.dataset-title {
  font-family:var(--mono); font-size:.52rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--white); opacity:.8;
}
.dataset-desc { font-size:.82rem; line-height:1.8; color:var(--muted); flex:1 }
.dataset-format {
  display:flex; gap:.4rem; flex-wrap:wrap; margin-top:.3rem;
}
.fmt-tag {
  font-family:var(--mono); font-size:.4rem; letter-spacing:.1em; text-transform:uppercase;
  padding:.2rem .5rem; background:rgba(255,255,255,.05); color:rgba(255,255,255,.4);
  border:1px solid rgba(255,255,255,.07);
}

/* ═══════════════════════════════════════════════════════════
   6. COLLABORATE
   ═══════════════════════════════════════════════════════════ */
.collab-sect {
  padding:8rem 2.5rem;
  border-top:1px solid var(--rule);
  background:var(--navy2);
  position:relative; overflow:hidden;
}
.collab-sect::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 70% at 50% 50%, rgba(78,205,196,.05), transparent 65%);
  pointer-events:none;
}
.collab-inner { max-width:1200px; margin:0 auto }
.collab-grid {
  display:grid; grid-template-columns:1.2fr 1fr; gap:5rem;
  align-items:center; margin-top:4rem;
}
.collab-ways { display:flex; flex-direction:column; gap:1.5rem; margin-top:3rem }
.collab-way {
  display:flex; gap:1.5rem; align-items:flex-start;
  padding:1.6rem; border:1px solid var(--rule); background:var(--navy3);
  transition:border-color .2s, background .2s;
}
.collab-way:hover { border-color:rgba(78,205,196,.25); background:rgba(78,205,196,.025) }
.collab-way-n {
  font-family:var(--display); font-size:2.5rem;
  color:transparent; -webkit-text-stroke:1px rgba(78,205,196,.3);
  line-height:1; flex-shrink:0; width:2.5rem;
}
.collab-way-title {
  font-family:var(--mono); font-size:.52rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--teal); display:block; margin-bottom:.4rem;
}
.collab-way-desc { font-size:.84rem; line-height:1.8; color:var(--muted) }
/* right side CTA */
.collab-cta-box {
  border:1px solid var(--rule); padding:3rem;
  background:var(--navy3); position:relative;
}
.collab-cta-box::before {
  content:''; position:absolute; top:0; left:0; right:0; height:1px;
  background:linear-gradient(to right, transparent, var(--teal), transparent);
}
.collab-cta-title {
  font-family:var(--serif); font-size:clamp(1.8rem,3vw,3rem);
  font-style:italic; line-height:1.1; margin-bottom:1.2rem;
}
.collab-cta-title em { font-style:normal; color:var(--teal) }
.collab-cta-desc { font-size:.88rem; line-height:1.85; color:var(--muted); margin-bottom:2rem }
.collab-cta-actions { display:flex; flex-direction:column; gap:.8rem }
.collab-note {
  margin-top:1.4rem; font-family:var(--mono); font-size:.46rem;
  letter-spacing:.13em; text-transform:uppercase; color:rgba(255,255,255,.22);
}

/* ─── REVEAL ──────────────────────────────────────────────── */
.reveal {
  opacity:0; transform:translateY(28px);
  transition:opacity .9s cubic-bezier(.22,.61,.36,1), transform .9s cubic-bezier(.22,.61,.36,1);
}
.reveal[data-from=left]  { transform:translateX(-30px) }
.reveal[data-from=right] { transform:translateX(30px) }
.reveal[data-from=scale] { transform:scale(.95); opacity:0 }
.reveal.in { opacity:1 !important; transform:none !important }

/* ─── MINI FOOTER ─────────────────────────────────────────── */
.mini-footer {
  padding:2rem 2.5rem;
  border-top:1px solid var(--rule);
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem;
  font-family:var(--mono); font-size:.48rem; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(255,255,255,.22);
}
.mf-brand { display:flex; align-items:center; gap:.5rem; color:rgba(255,255,255,.22) }
.mf-brand img { width:18px; height:18px; border-radius:50%; opacity:.35 }

/* ─── RESPONSIVE ──────────────────────────────────────────── */
@media(max-width:1024px) {
  .method-top { grid-template-columns:1fr; gap:3rem }
  .collab-grid { grid-template-columns:1fr; gap:3rem }
  .framework-grid { grid-template-columns:1fr 1fr }
}
@media(max-width:768px) {
  .topbar { padding:0 1.2rem }
  .method-sect, .papers-sect, .data-sect, .collab-sect { padding:5rem 1.2rem }
  .hero-meta { gap:1.5rem }
  .framework-grid { grid-template-columns:1fr }
  .kpi-bar { gap:1.5rem }
  .kpi-bar-divider { width:100%; height:1px }
  .papers-header { flex-direction:column; align-items:flex-start }
}
@media(max-width:560px) {
  .mini-footer { flex-direction:column; text-align:center }
  .hero-actions { flex-direction:column; align-items:center }
}
@media(prefers-reduced-motion:reduce) {
  .reveal { opacity:1 !important; transform:none !important; transition:none }
  .hero-eyebrow, .hero-sub, .hero-actions, .hero-meta { animation:none; opacity:1 }
  .word { animation:none !important; opacity:1 !important; transform:none !important }
}
@keyframes ripple { to { transform:scale(1); opacity:0 } }