/* =========================================================================
   Shared stylesheet. Edit once, changes every page.
   ========================================================================= */

:root{
  --ink:#16232E;
  --ink-soft:#3C4C58;
  --steel:#67757F;
  --paper:#EAEDEE;
  --sheet:#FFFFFF;
  --brass:#9C7C34;
  --rule:#CFD6D9;
  --good:#2E6A4F;
  --wa:#1F8F5F;

  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--serif);
  font-size:17px;
  line-height:1.6;
}

:focus-visible{outline:2px solid var(--brass);outline-offset:3px}

.wrap{
  max-width:70rem;
  margin:0 auto;
  background:var(--sheet);
  border-left:1px solid var(--rule);
  border-right:1px solid var(--rule);
}

/* ---------- draft strip: delete when figures are real ---------- */

.draft-strip{
  background:#7A2020;color:#fff;font-family:var(--mono);
  font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  text-align:center;padding:.7rem 1rem;line-height:1.6;
}

/* ---------- masthead ---------- */

.bar{
  display:flex;justify-content:space-between;align-items:center;gap:1.5rem;
  padding:1.4rem 4rem;border-bottom:1px solid var(--rule);
}

.brand{font-size:1.1rem;line-height:1.3;margin:0;text-decoration:none;color:inherit;display:block}
.brand small{
  display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--steel);margin-top:.35rem;
}

/* ---------- section nav ---------- */

.tabs{
  display:flex;gap:0;border-bottom:1px solid var(--rule);
  padding:0 4rem;overflow-x:auto;-webkit-overflow-scrolling:touch;
}

.tabs a{
  font-family:var(--sans);font-size:.9rem;text-decoration:none;color:var(--ink-soft);
  padding:1.05rem 1.5rem 1rem;white-space:nowrap;
  border-bottom:2px solid transparent;margin-bottom:-1px;
  transition:color .18s ease,border-color .18s ease;
}
.tabs a:first-child{padding-left:0}
.tabs a:hover{color:var(--ink)}
.tabs a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--brass);font-weight:500}

.tabs a .st{
  display:block;font-family:var(--mono);font-size:.53rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--steel);margin-top:.3rem;font-weight:400;
}
.tabs a .st.live{color:var(--good)}

/* ---------- hero ---------- */

.hero{padding:4rem 4rem 3.25rem;border-bottom:1px solid var(--rule)}

.eyebrow{
  font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--brass);margin:0 0 1.35rem;
}

.hero h1{
  font-weight:400;font-size:clamp(2.1rem,5vw,3.4rem);line-height:1.06;
  letter-spacing:-.018em;margin:0;max-width:31rem;
}

.hero .sub{
  font-family:var(--sans);font-size:1.03rem;line-height:1.6;
  color:var(--ink-soft);max-width:34rem;margin:1.35rem 0 0;
}

.trust{display:flex;flex-wrap:wrap;gap:0 2.5rem;margin:2.25rem 0 0;padding-top:1.35rem;border-top:1px solid var(--rule)}
.trust div{padding:.4rem 0}
.trust dt{font-family:var(--mono);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--steel)}
.trust dd{margin:.3rem 0 0;font-size:.97rem}

/* ---------- sections ---------- */

h2.head{
  font-family:var(--mono);font-weight:400;font-size:.62rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--steel);margin:0 0 1.5rem;
  padding-bottom:.75rem;border-bottom:1px solid var(--rule);
}

section.block{padding:3.5rem 4rem}
section.block + section.block{border-top:1px solid var(--rule)}

.prose{max-width:36rem}
.prose p{font-family:var(--sans);font-size:.97rem;line-height:1.68;color:var(--ink-soft);margin:0 0 1.15rem}
.prose p:last-child{margin-bottom:0}
.prose h3{font-weight:400;font-size:1.4rem;line-height:1.2;margin:2.5rem 0 .85rem;letter-spacing:-.01em}
.prose h3:first-child{margin-top:0}
.prose strong{color:var(--ink);font-weight:600}

/* ---------- table ---------- */

.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;min-width:40rem;font-family:var(--sans)}
th{
  text-align:left;font-family:var(--mono);font-weight:400;font-size:.58rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--steel);
  padding:0 1rem .7rem 0;border-bottom:1px solid var(--ink);
}
td{padding:.95rem 1rem .95rem 0;border-bottom:1px solid var(--rule);font-size:.9rem;vertical-align:top}
td.nm{font-family:var(--serif);font-size:1rem}

/* ---------- project cards ---------- */

.card{border:1px solid var(--rule);margin-top:1.75rem}
.card:first-of-type{margin-top:0}

.card-top{display:grid;grid-template-columns:1fr auto;gap:1.25rem;align-items:start;padding:1.75rem 1.85rem 1.35rem}
.card h3{margin:0;font-weight:400;font-size:1.55rem;line-height:1.15;letter-spacing:-.012em}
.card .meta{margin:.55rem 0 0;font-family:var(--sans);font-size:.87rem;color:var(--steel)}
.rank{font-family:var(--mono);font-size:.62rem;letter-spacing:.13em;color:var(--brass);padding-top:.4rem;white-space:nowrap}

.card .pitch{
  font-family:var(--sans);font-size:.94rem;line-height:1.62;color:var(--ink-soft);
  margin:0;padding:0 1.85rem 1.5rem;max-width:44rem;
}

.card .flaw{
  margin:0;padding:0 1.85rem 1.5rem;font-family:var(--sans);font-size:.92rem;
  line-height:1.62;color:var(--ink);max-width:44rem;
}
.card .flaw b{
  display:block;font-family:var(--mono);font-size:.57rem;letter-spacing:.13em;
  text-transform:uppercase;color:#9A3131;margin-bottom:.45rem;font-weight:400;
}

.specs{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--rule);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.specs div{background:var(--sheet);padding:1.1rem 1.25rem}
.specs dt{font-family:var(--mono);font-size:.57rem;letter-spacing:.13em;text-transform:uppercase;color:var(--steel)}
.specs dd{margin:.45rem 0 0;font-size:1rem;line-height:1.35}

.gate{display:grid;grid-template-columns:1fr auto;gap:1.5rem;align-items:center;padding:1.5rem 1.85rem;background:#F6F8F8}
.gate .g-label{font-family:var(--mono);font-size:.57rem;letter-spacing:.13em;text-transform:uppercase;color:var(--steel);margin:0 0 .5rem}
.gate .g-list{margin:0;padding:0;list-style:none;font-family:var(--sans);font-size:.9rem;color:var(--ink-soft)}
.gate .g-list li{padding:.12rem 0}
.gate .g-list li::before{content:"—  ";color:var(--brass)}

.permit{
  padding:.85rem 1.85rem;border-top:1px solid var(--rule);font-family:var(--mono);
  font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--steel);
  display:flex;flex-wrap:wrap;gap:.4rem 1.5rem;
}
.permit .warn{color:#9A3131}

/* ---------- whatsapp button ---------- */

.wa{
  display:inline-flex;align-items:center;gap:.6rem;background:var(--ink);color:#fff;
  font-family:var(--sans);font-size:.9rem;text-decoration:none;padding:.8rem 1.35rem;
  border:0;white-space:nowrap;transition:background .18s ease;
}
.wa:hover{background:var(--wa)}
.wa svg{width:1.05rem;height:1.05rem;flex:0 0 auto;fill:currentColor}
.wa-lg{font-size:.97rem;padding:.95rem 1.6rem}
.wa-note{font-family:var(--sans);font-size:.79rem;color:var(--steel);margin:.65rem 0 0}

/* ---------- hub cards ---------- */

.hub{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}

.hub a,.hub .soon{
  background:var(--sheet);padding:1.85rem 1.75rem 1.6rem;text-decoration:none;
  color:inherit;display:block;transition:background .18s ease;
}
.hub a:hover{background:#F6F8F8}

.hub h3{font-weight:400;font-size:1.32rem;line-height:1.18;margin:0 0 .7rem;letter-spacing:-.01em}
.hub p{font-family:var(--sans);font-size:.89rem;line-height:1.6;color:var(--ink-soft);margin:0}
.hub .status{
  font-family:var(--mono);font-size:.55rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--steel);display:block;margin-bottom:.9rem;
}
.hub .status.live{color:var(--good)}
.hub .soon{opacity:.62}

/* ---------- close block ---------- */

.close-block{padding:3.5rem 4rem;border-top:1px solid var(--rule);background:#F6F8F8}
.close-block h2{font-weight:400;font-size:clamp(1.6rem,3.6vw,2.3rem);line-height:1.14;letter-spacing:-.014em;margin:0;max-width:27rem}
.close-block p{font-family:var(--sans);font-size:.97rem;line-height:1.62;color:var(--ink-soft);max-width:32rem;margin:1.1rem 0 1.75rem}

.lines{margin:2.25rem 0 0;padding:0;list-style:none;max-width:30rem}
.lines li{display:flex;justify-content:space-between;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--rule);font-family:var(--sans);font-size:.94rem}
.lines .k{font-family:var(--mono);font-size:.58rem;letter-spacing:.13em;text-transform:uppercase;color:var(--steel)}
.lines a{text-decoration:none;border-bottom:1px solid var(--rule);padding-bottom:1px}
.lines a:hover{color:var(--brass);border-bottom-color:var(--brass)}

/* ---------- footer ---------- */

footer{padding:2.5rem 4rem 3.5rem;border-top:1px solid var(--rule);font-family:var(--sans);font-size:.79rem;line-height:1.68;color:var(--steel)}
footer p{max-width:42rem;margin:0 0 .8rem}
footer .fnav{margin:1.5rem 0 0;display:flex;flex-wrap:wrap;gap:.5rem 1.5rem}
footer .fnav a{color:var(--steel);text-decoration:none;border-bottom:1px solid var(--rule)}
footer .fnav a:hover{color:var(--ink)}
footer .fmono{font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--rule)}

/* ---------- responsive ---------- */





/* =========================================================================
   ADDED: numeral emphasis, portrait, developer marquee, hero video
   ========================================================================= */

/* The figure carries the argument, so it gets to be the largest thing here */
.big-num{
  font-variant-numeric: tabular-nums;
  letter-spacing:-.03em;
  color:var(--brass);
}

/* ---------- developer marquee ---------- */

.coverage{
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  padding:2.25rem 0 2rem;
  overflow:hidden;
}

.coverage .lead{
  padding:0 4rem 1.6rem;
  max-width:38rem;
}

.coverage .lead p{
  font-family:var(--sans);
  font-size:.95rem;
  line-height:1.65;
  color:var(--ink-soft);
  margin:0;
}

.coverage .lead b{color:var(--ink)}

.track-wrap{
  position:relative;
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}

.track{
  display:flex;
  width:max-content;
  animation:slide 240s linear infinite;
}

.track-wrap:hover .track{animation-play-state:paused}

.track .cell{
  flex:0 0 auto;
  width:9rem;
  height:3.5rem;
  margin:0 .35rem;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:.5rem .75rem;
}

.track .cell img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  /* monochrome keeps 100 logos from becoming a rainbow */
  filter:grayscale(100%) opacity(.55);
  transition:filter .25s ease;
}
.track .cell:hover img{filter:grayscale(0%) opacity(1)}

/* second row drifts the other way — reads as volume, not a single loop */
.track.rev{animation-direction:reverse;animation-duration:270s}

@keyframes slide{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

/* ---------- hero video ---------- */

.filmstrip{
  position:relative;
  border-top:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  background:var(--ink);
  aspect-ratio:16/7;
  overflow:hidden;
}

.filmstrip video,.filmstrip img.poster{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.filmstrip video{position:absolute;inset:0;opacity:0;transition:opacity .9s ease}
.filmstrip video.on{opacity:1}

.filmstrip .overlay{
  position:absolute;
  inset:0;
  display:flex;
  align-items:flex-end;
  padding:2rem 4rem;
  background:linear-gradient(0deg,rgba(22,35,46,.72),rgba(22,35,46,.05) 55%);
  pointer-events:none;
}

.filmstrip .overlay p{
  font-family:var(--mono);
  font-size:.6rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#fff;
  margin:0;
  max-width:30rem;
  line-height:1.9;
}





/* ---------- hero three-beat: escalate, escalate, cut ---------- */

.escalate{
  font-family:var(--sans);
  font-size:1.05rem;
  line-height:1.62;
  color:var(--ink-soft);
  max-width:33rem;
  margin:1.5rem 0 0;
}
.escalate b{color:var(--ink);font-weight:600}

/* The punchline earns its own space and a rule above it — the visual
   equivalent of a pause before the last line. */
.punch{
  font-family:var(--serif);
  font-size:clamp(1.6rem,3.6vw,2.5rem);
  line-height:1.1;
  letter-spacing:-.015em;
  color:var(--ink);
  margin:2.1rem 0 0;
  padding-top:1.6rem;
  border-top:2px solid var(--ink);
  max-width:22rem;
}

.hero .sub{margin-top:1.6rem;font-size:.97rem}



/* Typeset developer names — reads as a register rather than a logo wall */
.track .cell.name{
  width:auto;
  height:auto;
  padding:.55rem 1.4rem;
  border-right:1px solid var(--rule);
  margin:0;
}

.track .cell.name span{
  font-family:var(--mono);
  font-size:.63rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--steel);
  white-space:nowrap;
  transition:color .25s ease;
}
.track .cell.name:hover span{color:var(--brass)}



/* Citation under the hero figures. Deliberately small and quiet — it is
   there to be checked, not read. */
.sourceline{
  font-family:var(--mono);
  font-size:.58rem;
  line-height:1.85;
  letter-spacing:.06em;
  color:var(--steel);
  max-width:31rem;
  margin:1.6rem 0 0;
  padding-top:.9rem;
  border-top:1px solid var(--rule);
}

.sourceline a{
  color:var(--steel);
  text-decoration:none;
  border-bottom:1px solid var(--rule);
}
.sourceline a:hover{color:var(--brass);border-bottom-color:var(--brass)}



/* ---------- footnote marker ---------- */

.fnmark{
  font-family:var(--sans);
  font-size:.42em;
  vertical-align:super;
  line-height:0;
  color:var(--brass);
  text-decoration:none;
  margin-left:.05em;
}
a.fnmark:hover{color:var(--ink)}

.sourceline .fnmark{
  font-size:.9em;
  vertical-align:baseline;
  margin:0 .35em 0 0;
}

/* The count lands instantly for a skimmer; the scrolling names reward
   anyone who lingers. Two audiences, one section. */
.coverage .devcount{
  font-family:var(--serif);
  font-size:clamp(1.5rem,3.4vw,2.2rem);
  line-height:1.1;
  letter-spacing:-.015em;
  color:var(--ink);
  margin:0 0 .9rem;
}
.coverage .devcount .big-num{font-size:1.35em}

/* centred coverage headline above the marquee */
.coverage .lead.centred{
  max-width:44rem;
  margin:0 auto;
  text-align:center;
  padding-bottom:2rem;
}

.coverage .devcount{
  font-family:var(--serif);
  font-size:clamp(1.5rem,3.6vw,2.35rem);
  line-height:1.14;
  letter-spacing:-.015em;
  color:var(--ink);
  margin:0;
}

.coverage .devsub{
  font-family:var(--mono);
  font-size:.62rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--steel);
  margin:1rem 0 0;
}

/* rejection count — the number that makes the shortlist mean something */
.rejected{
  font-family:var(--serif);
  font-size:clamp(1.25rem,2.8vw,1.75rem);
  line-height:1.2;
  letter-spacing:-.012em;
  color:var(--ink);
  margin:0 0 1.25rem;
  max-width:32rem;
}
.rejected .big-num{font-size:1.4em}

/* the four-line prompt: makes replying feel like filling four blanks */
.fourlines{
  list-style:none;
  margin:0 0 1.85rem;
  padding:0;
  max-width:26rem;
  border-top:1px solid var(--rule);
}

.fourlines li{
  display:flex;
  gap:1rem;
  align-items:baseline;
  padding:.7rem 0;
  border-bottom:1px solid var(--rule);
  font-family:var(--sans);
  font-size:.95rem;
  color:var(--ink);
}

.fourlines .n{
  font-family:var(--mono);
  font-size:.6rem;
  letter-spacing:.12em;
  color:var(--brass);
  flex:0 0 auto;
}

/* ---------- centred section heading ---------- */

h2.head.centred{
  text-align:center;
  border-bottom:0;
  padding-bottom:0;
  margin-bottom:2rem;
}

/* ---------- panoramic portrait ---------- */

.pano{
  margin:0 0 2.5rem;
  padding:0;
}

.pano img{
  width:100%;
  height:auto;
  display:block;
  border:1px solid var(--rule);
}

.pano figcaption{
  font-family:var(--mono);
  font-size:.57rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--steel);
  line-height:1.9;
  margin-top:.85rem;
  text-align:center;
}

/* prose that sits under a full-width element reads better centred-in-column */
.prose.wide{
  max-width:40rem;
  margin:0 auto;
}

/* =========================================================================
   RESPONSIVE — every media query lives here, at the end of the file, so
   nothing declared above can override it. Appending new desktop rules
   after this block is what broke the mobile layout once already.
   ========================================================================= */

@media (max-width:880px){

  /* ---- shell & chrome ---- */
  .wrap{border:0}
  .bar,.hero,section.block,.close-block,footer,.tabs{padding-left:1.35rem;padding-right:1.35rem}
  .bar{flex-direction:column;align-items:flex-start;gap:1rem}
  .bar .wa{width:100%;justify-content:center}
  .brand{font-size:1.02rem}
  .tabs{padding-left:1.35rem;padding-right:1.35rem}
  .tabs a{padding:.9rem 1rem .85rem;font-size:.85rem;display:flex;flex-direction:column;justify-content:flex-start}
  .tabs a .st{margin-top:.28rem}
  .tabs a:first-child{padding-left:0}

  /* ---- hero ---- */
  .hero{padding:2.25rem 1.35rem 2.25rem}
  .hero h1{font-size:2rem;line-height:1.08}
  .escalate{font-size:.95rem;margin-top:1.25rem;max-width:none}
  .sourceline{font-size:.55rem;letter-spacing:.04em;max-width:none}
  .punch{font-size:1.5rem;margin-top:1.35rem;padding-top:1.1rem;max-width:none}
  .hero .sub{font-size:.93rem;margin-top:1.35rem;max-width:none}
  .trust{
    display:grid;
    grid-template-columns:1fr;
    gap:0;
    margin-top:1.75rem;
  }
  .trust div{
    padding:.7rem 0;
    border-bottom:1px solid var(--rule);
    display:grid;
    grid-template-columns:7.5rem 1fr;
    align-items:baseline;
    gap:.75rem;
  }
  .trust div:last-child{border-bottom:0}
  .trust dt{padding-top:.12rem}
  .trust dd{font-size:.9rem;margin:0;overflow-wrap:anywhere}

  /* ---- sections ---- */
  section.block{padding-top:2.25rem;padding-bottom:2.25rem}
  h2.head{margin-bottom:1.25rem}
  .prose{max-width:none}
  .prose p{font-size:.93rem}
  .prose h3{font-size:1.2rem}

  /* ---- filmstrip ---- */
  .filmstrip{aspect-ratio:5/4}
  .filmstrip .overlay{padding:1.25rem}
  .filmstrip .overlay p{font-size:.53rem;letter-spacing:.12em;line-height:1.8}

  /* ---- hub cards ---- */
  .hub{grid-template-columns:1fr}
  .hub a,.hub .soon{padding:1.5rem 1.35rem 1.35rem}
  .hub h3{font-size:1.2rem}

  /* ---- panoramic portrait ---- */
  .pano{margin-bottom:1.85rem}
  .pano figcaption{font-size:.53rem;letter-spacing:.1em}
  .prose.wide{max-width:none}
  h2.head.centred{margin-bottom:1.35rem}

  /* ---- developer coverage ---- */
  .coverage{padding:1.85rem 0 1.6rem}
  .coverage .lead.centred{padding:0 1.35rem 1.6rem;max-width:none}
  .coverage .devcount{font-size:1.4rem}
  .coverage .devsub{font-size:.55rem;letter-spacing:.14em;margin-top:.8rem}
  .track .cell{width:7rem;height:2.9rem}
  .track .cell.name{padding:.45rem .9rem}
  .track .cell.name span{font-size:.55rem;letter-spacing:.1em}

  /* ---- table: let it scroll, do not squeeze ---- */
  .tbl-scroll{margin:0 -1.35rem;padding:0 1.35rem}
  table{min-width:34rem}
  td,th{font-size:.83rem}

  /* ---- project cards ---- */
  .card-top{grid-template-columns:1fr;padding:1.25rem 1.15rem .9rem;gap:.5rem}
  .card h3{font-size:1.3rem}
  .rank{padding-top:0}
  .card .pitch,.card .flaw{padding:0 1.15rem 1.15rem;font-size:.9rem;max-width:none}
  .specs{grid-template-columns:1fr 1fr}
  .specs div{padding:.85rem 1rem}
  .specs dd{font-size:.93rem}
  .gate{grid-template-columns:1fr;padding:1.15rem}
  .gate .wa{width:100%;justify-content:center}
  .permit{padding:.8rem 1.15rem;font-size:.53rem;gap:.35rem 1rem}

  /* ---- rejections ---- */
  .rejected{font-size:1.3rem;max-width:none}

  /* ---- close block ---- */
  .close-block{padding-top:2.25rem;padding-bottom:2.25rem}
  .close-block h2{font-size:1.5rem;max-width:none}
  .close-block p{font-size:.93rem;max-width:none}
  .fourlines{max-width:none}
  .fourlines li{font-size:.9rem}
  .wa-lg{width:100%;justify-content:center;font-size:.92rem}
  .lines{max-width:none}
  .lines li{font-size:.9rem}

  /* ---- footer ---- */
  footer{padding-top:2rem;padding-bottom:2.5rem}
  footer p{font-size:.76rem;max-width:none}
  .fnav{gap:.4rem 1.1rem}
}

@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
  *{transition-duration:.01ms !important}

.track{animation:none}
  .pano img{filter:grayscale(0%)}
}